π Welcome to the course assets for the first week of Intro to User Interface Design, which includes knowledge testers, quick links to exercises, projects and homework, as well as resource links to videos, articles and books, some of which are noted in the lessons, to deepen your learning!
<aside> π Here it is! Just a very small quick-fire quiz to test your knowledge this week. No peeking at the answers below, and donβt worry if you get any wrong!
Click the toggle to reveal the answer.
</aside>
We can't wait to see what you create π
Note:
Exercises and projects are part of courses lessons and done in tandem with the teacher, whereas homeworks are "take-home" assignments. Please post your final homework in the Slack channel #help-intro-to-ui for feedback!
Personal remixes to the original exercise, project and homework are STRONGLY ENCOURAGED πͺ
Exercise, Project and Homework
Downloads
Guides & Cheat Sheets
The History of the Alto by the Computer History Museum
Web 101: A History of the GUI by WIRED
You Know What? F*ck Dropdowns!
Laws of UX (Using Psychology to Design Better Products & Services) by Jon Yablonski
10 Usability Heuristics for User Interface Design β Nielsen Normal Group
Intro to UI: Design Elements and Principles
Intro to UI: Examples of UI Patterns (Both Interesting & Annoying)
Designing in Figma Book by Eugene Fedorenko
Styles in Figma β a blog post by Figma Design
Figma Tutorial by Figma Design: Creating Styles
Components, Styles and Shared Library Best Practices β a blog post by Figma Design (reviews the slash-naming convention!)
8px Baseline Grid
Design Systems: Space, Grids and Layouts by Elliot Dahl
Medium: The Comprehensive 8pt Grid Guide by Vitsky
UX Design: How to Create Stronger Layouts with the 8pt Grid System
Colors in Web Design
The Psychology of Color in Web Design
5 Color Choices You Absolutely Must Avoid When Designing for the Web
If you have a course-related question or bug, post it in the Q&A below each video. Our team will respond (and you'll receive an email notification) ASAP during office hours. We'll follow-up if we need more info from you.
We're also available via email hi@superhi.com and via chat if you want to ask anything privately, though we encourage asking publicly whenever possible!
A polite note: email and chat messages go to the same mailbox, so you won't receive a faster reply if you ask multiple times. Just once is great!
If you have a non-course question or are looking for feedback on a project, feel free to post in the Slack channel #help-intro-to-ui, where both SuperHi staff and our student community are hanging out. Everyone helps each other out here!
We also have the more general #help channel, for non-course chat, feedback and questions.
SuperHi is a small (but mighty!) team so please don't DM staff β keeping your question public helps us, as a team, follow-through as quickly and as efficiently as possible. π