IN CLASS
Exercise: Tarot Cards of Tech. This will help consider unintended consequences of your concept.
Give feedback about design choices and usability.
- Design aspects such as typography, color, layout, hierarchy, organization, alignment, photography or illustration style, icon design and consistency.
- Usability aspects could include overall clarity and user-friendliness, such as clear headings, icons, consistent navigation, legibility, finger-tapping size, gestural cues, and so on.
- Pick favorite designs of each team and describe what keywords / vibes / characteristics you are getting from the different looks.
UI RESOURCES
[expand title=”Click to see Lectures, UI Design, Accessibility, Icon Design, Patterns, Environmental”]
Lectures
- Newer UI Lectures:
- Design For Simplicity
- Visual Perception
UI Design
- A Comprehensive Guide to Mobile App Design
- Summary of UI Design Do’s and Don’ts
- Button UX Design: Best Practices, Types, and States
- iOS vs Android App UI Design: The Complete Guide
- Human Interface Guidelines website
- Google Material Design
Accessibility
Icon Design
- Icon Design
- 10 Essential Tips for UI Icons
- Small Elements, Big Impact
- Designing for UI
- UI Design Glossary
- The Noun Project
- Free Icons Sets
UI Patterns
- 13 basic mobile UI patterns
- iospirations
- screenlane
- mobile-patterns
- mobbin
- ui-patterns
- design vault
- UI movement
Environmental Design Tips
- Designing for Environments and Accessibility (rules and tips for environ design)
- You’re a UI Designer, You Just Don’t Know it Yet
- Designing for Interactive Environments and Smart Spaces
- ADA Standards for Accessible Design
[/expand]
DUE TUESDAY by class time
Read this: A Comprehensive Guide to Mobile App Design
Task 17: Design Refinements
- Design Refinements
- After receiving feedback from your classmates on your designs, choose a design direction as a team.
- Make design refinements and apply to the majority of the screens in your user flow(s).
- Make design guidelines for the team to follow and/or you may want to co-edit the same file.
- Share Link
- Link to the file with unified refinements on the #project2 Slack Channel, so we can critique in class on Tuesday. It isn’t required to be clickable until next Thursday.
- Toolkits: The following prototyping toolkits can help you start with the appropriate sizing for nav bars, typography, and icons. However, still apply your own branding for your product.
- iOS Toolkits. (sketch files listed can open in Figma)
- Google Material Toolkit. (kits are under “Design Resources”)