UX UI Design Mastery - From Theory To Live Website In Adobe Xd And Webflow

Ux Ui Design Mastery - From Theory To Live Website In Adobe Xd And Webflow
About This Class
Your class project for this class is to follow along the design section and create the website design using the files I provided. I encourage you to experiment and use different fonts, colors and imag
Description
Most designers when they learn just skip the fundamentals and move straight to their favorite software and start designing. And then they realize that something is wrong with their design, but because they skipped the theory, they don't know what is the issue and how to fix it.
That is the reason I asked over 60.000 of my students and turned the answers I got into the biggest online UI/UX design course ever created.
Hey designer, my name is Alex and in this Skillshare class we will cover
UX Design Basics
Design Briefs
Project Proposals
User Research and Personas
Competitive Analysis
User Flows
Paper Wireframes
Layouts and Grids
Typography and Font Pairing
Iconography
Color Selection
Working With Images
Mood Boards
UI Kits
Design Systems
We will design a website in Adobe Xd
Build it in Webflow and launch it
Create Case Studies
Cover where to find a job you want
Over two years of work went into making this course and over 20 years of learning and working with clients. There is over 24 hours of video content inside, plus templates and practice files are included as well so you can kickstart your career and your learning process much faster,
I look forward to see you in class and to see your class projects!
Have a creative day.
Alex
Project Guide
Your class project for this class is to follow along the design section and create the website design using the files I provided. I encourage you to experiment and use different fonts, colors and images if you can, so you can get a different result then everybody else.
When you create it, upload an image to the class project, I would love to give you feedback and guidance so you can improve faster.
If you find it too difficult, then each section has it's own assignment so you can follow along and practice those and upload them here.
I look forward to your class projects and to see what you guys will create.
Have fun!
Alex
Overview
Lesson 1:Class Intro
Lesson 2:Course structure and project files
Lesson 3:Class Project
Lesson 4:SECTION 1 UX Design Basics
Lesson 5:What is UX Design
Lesson 6:What does UX designer do
Lesson 7:Is UX the same as UI
Lesson 8:Skills UX designer needs
Lesson 9:In House VS Freelance UX Designer
Lesson 10:Tools for UX Designers
Lesson 11:SECTION 1 ASSIGNMENT
Lesson 12:SECTION 2 Design Briefs
Lesson 13:What is a design brief
Lesson 14:Creating a design brief in Adobe Xd
Lesson 15:SECTION 3 Project Proposals
Lesson 16:What is a project proposal
Lesson 17:When should you send it
Lesson 18:Creating a project proposal in Adobe Xd
Lesson 19:Proposal cover
Lesson 20:Project details
Lesson 21:Project pricing
Lesson 22:Terms and conditions
Lesson 23:About You
Lesson 24:SECTION 4 User Research and Personas
Lesson 25:What is a User Persona
Lesson 26:Types of research methods
Lesson 27:Quantitative VS Qualitative
Lesson 28:Choosing your participants
Lesson 29:Visualising your data
Lesson 30:Creating Your User Persona
Lesson 31:SECTION 4 ASSIGNMENT
Lesson 32:SECTION 5 Competitive Analysis
Lesson 33:What is a competitive analysis
Lesson 34:Types of competitive analysis
Lesson 35:How to do a complete analysis
Lesson 36:How to do a feature analysis
Lesson 37:Which tools to use
Lesson 38:Things to look out for
Lesson 39:SECTION 5 ASSIGNMENT
Lesson 40:SECTION 6 User Flows
Lesson 41:What are user flows
Lesson 42:Different user flow types
Lesson 43:When are they used
Lesson 44:Creating user flows in Adobe Xd
Lesson 45:Working with flowcharts in Adobe Xd
Lesson 46:Sharing your flows
Lesson 47:SECTION 6 ASSIGNMENT
Lesson 48:SECTION 7 Paper Wireframes
Lesson 49:What are paper wireframes
Lesson 50:Which elements to include
Lesson 51:Wireframe styles
Lesson 52:Equipment you need
Lesson 53:Drawing on plain paper
Lesson 54:Drawing on dot grid paper
Lesson 55:Using printable templates
Lesson 56:Sharing your wireframes
Lesson 57:SECTION 7 ASSIGNMENT
Lesson 58:SECTION 8 Layout and Grids
Lesson 59:What is a layout
Lesson 60:What is a grid system and why it's important
Lesson 61:How to set up grids in Adobe Xd
Lesson 62:Working with Bootstrap
Lesson 63:Working with 8px grid system
Lesson 64:Horizontal rhythm in Adobe Xd
Lesson 65:SECTION 8 ASSIGNMENT
Lesson 66:SECTION 9 Typography and Font Pairing
Lesson 67:Typefaces VS Fonts
Lesson 68:Font types
Lesson 69:Font weights and how to use them
Lesson 70:Choosing fonts
Lesson 71:Font Pairing
Lesson 72:Font scale
Lesson 73:SECTION 9 ASSIGNMENT
Lesson 74:SECTION 10 Iconography
Lesson 75:What Are Icons
Lesson 76:Different Types Of Icons
Lesson 77:Icon Libraries, Packs And File Formats
Lesson 78:Free VS Premium Icons
Lesson 79:Tips For Best Results
Lesson 80:SECTION 10 ASSIGNMENT
Lesson 81:SECTION 11 Color Selection
Lesson 82:Why color is important
Lesson 83:Which colors exist
Lesson 84:Color combinations
Lesson 85:Color selection tools
Lesson 86:Style guides for developers
Lesson 87:SECTION 11 ASSIGNMENT
Lesson 88:SECTION 12 Images
Lesson 89:Why are images important
Lesson 90:3 types of project images
Lesson 91:How to choose niche images
Lesson 92:Free VS Premium
Lesson 93:Image Optimization
Lesson 94:Naming Structure
Lesson 95:SECTION 12 ASSIGNMENT
Lesson 96:SECTION 13 Mood Boards
Lesson 97:What are mood boards and why use them
Lesson 98:Which elements to consider
Lesson 99:How to do your research
Lesson 100:Create mood board in Adobe Xd
Lesson 101:Share or export your mood board
Lesson 102:SECTION 13 ASSIGNMENT
Lesson 103:SECTION 14 UI Kits
Lesson 104:What are UI Kits and why are they useful
Lesson 105:Types of UI Kits
Lesson 106:Which components are important
Lesson 107:UI Kit structure in Adobe Xd
Lesson 108:UI Kit creation in Adobe Xd
Lesson 109:UI Kit VS Design Systems
Lesson 110:Premium VS Free UI Kits
Lesson 111:Creating and selling your UI Kit
Lesson 112:SECTION 14 ASSIGNMENT
Lesson 113:SECTION 15 Design Systems
Lesson 114:What is a Design System
Lesson 115:Structure of a design system
Lesson 116:Design system examples
Lesson 117:Creating a design system in Adobe Xd
Lesson 118:Design tokens
Lesson 119:Scaling your design system
Lesson 120:SECTION 15 ASSIGNMENT
Lesson 121:SECTION 16 Website Design in Adobe Xd
Lesson 122:Design Brief
Lesson 123:Project Proposal
Lesson 124:User Persona
Lesson 125:Competitive Analysis
Lesson 126:User Flows
Lesson 127:Sitemap Content Architecture
Lesson 128:Paper Wireframes
Lesson 129:Project Images
Lesson 130:Mood Board Creation
Lesson 131:Grid, Typography and Colors
Lesson 132:Home Page Design
Lesson 133:Home Page Design Part 2
Lesson 134:Home Page Design Part 3
Lesson 135:Home Page Design Part 4
Lesson 136:Cars Page Design
Lesson 137:Car Details Page
Lesson 138:Lightbox Design
Lesson 139:Loans Page
Lesson 140:Contact Us Page
Lesson 141:Animating The Design
Lesson 142:Exporting The Assets
Lesson 143:Designing For Responsive
Lesson 144:Future Of Adobe Xd
Lesson 145:SECTION 16 ASSIGNMENT
Lesson 146:SECTION 17 Webflow Build
Lesson 147:Introduction To Webflow
Lesson 148:Setting Up The Project
Lesson 149:Creating Style Guide
Lesson 150:Navbar Build
Lesson 151:Home Hero Section
Lesson 152:Who We Are Section
Lesson 153:Car Selection Section
Lesson 154:Offer Section
Lesson 155:Benefits Section
Lesson 156:Contact Form
Lesson 157:Map Section
Lesson 158:Footer Section
Lesson 159:Creating CMS Collection
Lesson 160:Using CMS Collection
Lesson 161:Cars Page Build
Lesson 162:Cars Template Build
Lesson 163:Cars Template Build Part 2
Lesson 164:Cars Template Build Part 3
Lesson 165:Cars Template Build Part 4
Lesson 166:Linking Car Cards
Lesson 167:Loans Page
Lesson 168:Contact Us Page
Lesson 169:Adding Links
Lesson 170:Responsive Tablet
Lesson 171:Responsive Mobile Landscape
Lesson 172:Responsive Mobile Portrait
Lesson 173:Animations in Webflow
Lesson 174:Publish And Code Export
Lesson 175:SEO Optimization
Lesson 176:SECTION 17 ASSIGNMENT
Lesson 177:SECTION 18 Case Studies
Lesson 178:What Is A Case Study
Lesson 179:Elements To Include
Lesson 180:Creating Case Study Structure
Lesson 181:Awesome Case Study Examples
Lesson 182:Content Writing
Lesson 183:Presentation Tips
Lesson 184:SECTION 18 ASSIGNMENT
Lesson 185:SECTION 19 Finding a Job
Lesson 186:Freelance VS Agency
Lesson 187:Design Contests
Lesson 188:Gig Platforms
Lesson 189:Digital Nomads
Lesson 190:Design Platforms
Lesson 191:Webflow Jobs
Lesson 192:Portfolio Tips
Lesson 193:Course Conclusion And Next Steps
https://www.skillshare.com/en/classes/UX-UI-Design-Mastery-From-Theory-To-Live-Website-In-Adobe-Xd-And-Webflow/791244434