|
所在平台: Udemy |
课程主页: https://www.udemy.com/course/framer-design/
课程评论：没有评论
课程名称：Framer Crash Course - 设计、编码与协作 课程概述：这门课程旨在教会学生如何使用Framer工具进行设计、原型制作、编码和项目共享。Framer结合了直观的可视化编辑与灵活的编码，使用户能够在一个智能界面中完成整个设计工作流程。通过Framer，用户能够在将工作交给工程师之前，完善和验证交互、动画和流程。该工具已经被Dropbox、Facebook、Google、Disney和Uber等全球产品团队广泛使用。 课程内容包括： 1. 重建浮动操作按钮（Floating Action Button）的设计与编码，学习如何使用图标库设计按钮，并通过春曲线实现场景切换。 2. 向项目中添加声音及事件触发动画的相关讲解。 3. 一些调研小测验，帮助测试学习者的知识掌握。 Framer的设计工具提供了熟悉的图形工具体验，同时具有创新性。其自动布局和智能分组算法让响应式设计变得轻而易举，用户可以在特定设备的屏幕上进行精确绘制，并通过开启目标动画功能进行设计。Framer的交互设计简便易学，即使是初学者也能轻松上手，通过一键动画插入和简单的滑块控制自定义效果。 此外，Framer还提供全功能代码编辑器、智能自动补全、实时同步画布、层级管理、视觉属性编辑等丰富功能，使得设计和原型制作变得更加高效和轻松。通过无缝共享，Framer还促进了团队与客户之间的协作。 总之，Framer Crash Course是一门结合设计与开发的实用课程，适合希望提升设计技能和原型制作能力的学习者。
UPDATES: July 18th, 2017Creating a Floating Action Button: In this lesson, we'll learn how to recreate a floating action button (like Material Design) on Framer. We'll design it using the icon library and code it by switching between two states with a spring curve. July 4th 2017 Published a lecture on adding sounds to your projects and how to trigger them with events and animations.Added a quiz on the third section. Test your knowledge! · · · · · · · · · · · · · · · · · · · · · · · · · · · ·DESCRIPTIONLet's learn Framer! Framer is a tool for drawing, prototyping, coding, and sharing projects across teams. It combines the familiarity of visual editing with the flexibility of code. It gives you an entire design workflow in one smart interface. With Framer you can deliver end-to-end experiences. Framer allows you to perfect and validate interaction, animation, and flow before handing off your work to engineers. Framer bridges this gap between design and development, making it the tool of choice for product teams worldwide like Dropbox, Facebook, Google, Disney, and Uber. Interface design, in a stunning way. With Framer Design you get the familiarity of your favorite graphics tools, with a twist. Framer's intuitive auto-layout and smart grouping algorithms make responsive design a breeze. Draw with pixel perfect precision on device-specific screens, then turn on targeting to animate. Framer is a design tool engineered for interaction work. You can insert artboards, draw layers, add text and images. Every new layer added to the canvas responds to the environment around it. It's responsiveness is so good that it feels like magic. Here's some things that make designing with Framer different and fun: Auto-sequencing with artboards.Insert and manipulate shapes.Advanced text tools.Automated layer nesting.A canvas that adapts across all devicesIcon management panel.Layer clipping. Interaction design, quick and easy! Framer makes it easy to get into coding, even if you're a beginner. You only need one-click to insert an animation with Auto-Code. Customize further with simple slider controls and direct manipulation. You can use the components to add premade native interactions and multi-screen app flows. It's the simplicity of WYSIWYG, backed by the power of code. Auto-Code makes bringing your designs to life as simple as inserting an animation or event. Style using the slider controls or by editing directly in the canvas. No matter how you like to work, Framer always keeps your code intact for you. Here are some of the things you can easily implement: Insert layers, animations, events and snippets.Full-featured code editor.Smart auto-complete.In-app documentation.Error inspector.Position layers directly on the canvas.Visual property editing.Device picker.Detachable canvas.Real-time canvas syncing. Framer makes designing and prototyping easy. With Framer you can design in a smarter way, you can bring your screens to life with simple code, and you can collaborate with your team or clients via seamless sharing.
