پیشنهاد فرادرس

آموزش Framer برای طراحی UX

دسته بندی ها: آموزش Framer.js ، آموزش UX ، آموزش طراحی وب ، آموزش های لیندا (Lynda)

Framer  یک فریمورک برای ایجاد نمونه های سریع و آسان مبتنی بر جاوا اسکریپت است. این دوره به طراحان UX  و تعاملی کمک می کند تا مهارت های لازم برای  درست کردن و راه اندازی Framer برای طراحی UX را کسب کنند. مربی امانوئل هنری نشان می دهد که چگونه از ابزار طراحی بصری و همچنین تا حدودی  CoffeeScript code برای ساخت نمونه های جذاب استفاده کنید. همینطور نشان می دهد چطور دارایی ها را از برنامه هایی چون افزودن انیمیشن، Sketch و interactions وارد کنید. در پایان این دوره شما مهارت های جدید و یک پروژه watchOS اولیه خواهید داشت که می توانید آن را مبنای نمونه های UX خودتان با Framer قرار دهید.

سرفصل ها:

  • واردکردن طرح هایی از انگاره
  • درج و طراحی ظاهر صفحات
  • اضافه کردن انیمیشن
  • برنامه نویسی با متغیرها و اشیاء
  • برنامه نویسی با توابع و قطعه های کد
  • افزودن تعاملات
  • افزودن انیمیشن
  • نهایی کردن یک نمونه اولیه Framer
Framer for UX Design Publisher:Lynda Author:Emmanuel Henri Duration:3h 4m Level:Intermediate

Learn how to use Framer in your UX design process. This course shows how to build UX prototypes complete with interactions and animation.
Released: 3/19/2018
Framer is a macOS application for creating JavaScript-based prototypes quickly and easily. This course provides UX and interaction designers with the skills they need to get up and running with Framer for UX design. Instructor Emmanuel Henri shows how to use the visual design tools as well as a little bit of CoffeeScript code to build engaging prototypes. He also shows how to import assets from programs like Sketch, add animation, and insert interactions. At the end of the course, you'll have new skills and a basic watchOS project you can use as a jumping off point for your own UX prototypes with Framer.
Topics include:
Importing designs from Sketch
Inserting and styling screens
Adding animation
Programming with variables and objects
Programming with functions and code snippets
Adding interactions
Adding animation
Finalizing a Framer prototype
Introduction
Welcome
46s
Course prerequisites
1m 8s
Using the exercise files
1m 18s
1. A Refresher on Great UX
UX courses and inspiration
3m 48s
Our project UX
4m 9s
2. The Framer UI
Overview of the interface
6m 36s
The design section
8m 59s
The code section
7m 18s
Importing from Sketch
6m 22s
The story behind the prototype
2m 48s
3. The Non-Coding Framer Tools
Second screen with the Design tool
15m 21s
Third and fourth screen with the Design tool
6m 16s
Insert animation with Auto-Code
8m 31s
4. Programming Basics and Usage with Framer
General syntax quick start
5m 31s
Variables and objects
7m 2s
Functions and code snippets
3m 55s
5. Finalizing Our Screen Assets
Create assets for Hunora screens
10m 23s
Create assets for Clestik screens
9m 54s
Challenge: Create final screens of the story
2m 38s
Solution: Create final screens of the story
2m 37s
6. Add Interactions to Our Prototype
Introduction to interactions
15m 4s
Introduction to a scrolling component
7m 53s
Functions for animations and a challenge
9m 42s
Solution to challenge
6m 56s
7. Add Final Interactions to the Prototype
Complex interactions: Initialized states
7m 37s
Complex interactions: Steer right
11m 38s
Challenge: Complete interactions
3m 53s
Solution: Complete interactions
5m 35s
Conclusion
Next steps
1m 11s

پیشنهاد فرادرس

لینک های دانلود حجم فایل: 2.14GB همراه با زیرنویس انگلیسی Lynda Framer for UX Design_git.ir.part1.rar Lynda Framer for UX Design_git.ir.part2.rar Lynda Framer for UX Design_git.ir.part3.rar
captcha