user-experience.md

User Experience

Brian Lovin's design critiques are great. Refactoring UI & Apple Human Interface Guidelines are good reads.

Love command palettes.

Notes

• Like how Stripe does the hamburger menu on mobile.
• Underappreciated competitive advantage: letting people do x without creating an account.
• Love how both Apple & Linear present features in neat boxes on a grid.
• My firmest design opinion is that every piece of software should have a cute animal mascot that helps you out as you go through onboarding and stuff. No exceptions.
• There are lots of things that engineers can learn from the design community but these two are particularly important: 1. Being able to visually compare variations of your work side by side is really useful. 2. Creating duplicates of your current work should be fast and easy.
• Rare destructive action where you need to be sure of user intention.
• Don't use 16px icons on web, they're hard to tap. If you want to use 16px, wrap it in a 24px container, this will increase the tappable area, whilst maintaining the size of the icon.
• Can right click on Vercel home icon to see brand assets
• New user onboarding and activation is one of the most critical things for teams to test. Unfortunately it’s also one of the hardest, since people don’t go though the NUX flow more than once as a matter of course. So most teams stay blissfully unaware of what new users experience.
• One of the coolest onboarding tricks I've seen recently - do different tasks for a product onboarding to add days to your free trial.
• Every app should have a cmd+k command palette interface to search actions
• Right click logo to get press kit
• “Modal” is when user input goes into an alternate mode. It is not an overlay window. Better language for an overlay window: “Dialog box” or “Pop-up window.”
• Stripe's DX: 1. Docs have lots of examples. 2. Helpful error messages. 3. Testing mode. 4. Local dev experience with the CLI is so good. 5. Great-looking pre-built components.
• Decrease CTAs to only meaningful interactions.
• Love the dot on top to show which part of website you are.
• Focus on: Layout. Hierarchy. Feature discoverability. Seeding content. In the shortest time possible, do whatever you can to: 1. Get users to the Aha Moment (i.e., "Oh that's what this app is for". 2. Activated (e.g., reach minimum friend count).
• Successful product starts with a great onboarding.

Links

• Ask HN: What's the best book on modern UI/UX? (2018)
• UX: Checkout redesign (2019)
• Where to put buttons on forms (2019)
• User Onboarding
• Annoying Technology
• Cleaning up form UI
• Principles of User Interface Design
• Spatial Software (2020)
• The Decline of Usability (Lobsters) (HN)
• Hamburger Menus and Hidden Navigation Hurt UX Metrics (2016) (Tweet)
• Learn UX Writing - Curated list of best resources for learning the principles of writing great copy for product interfaces.
• Cognitive Biases & Principles That Affect Your UX (2020) (HN)
• Stop setting the language of your website based on my location (2020) (Lobsters) (HN)
• Dark Patterns: Past, Present, and Future: The evolution of tricky user interfaces (2020)
• UI Components & UX Patterns Examples
• Nice examples of UX improvements for website
• Design and Anatomy of a Push Notification 2020
• Waveguide - Customer Experience Examples and UX Design Examples.
• Menus, Metaphors and Materials: Milestones of User Interface Design (2020)
• Writing UX copy for buttons and links (2020)
• Laws of UX - Help anyone understand web design principles for the sites we use everyday. (HN) (Reddit)
• The UX of LEGO Interface Panels (2020)
• How to conduct UX user interviews (2020)
• UX design: Tools, methods and frameworks for generalists (2020) (HN)
• Read Me: Web - To keep attention focused, readability is key. (HN)
• Why Do We Interface? - Micro-book with incomplete observations on human-computer interfaces.
• The How (and Why) of User Flows
• Learn UXD - Learn user-first design.
• Stop Asking Me to “Sign Up” (2014) (HN)
• Guide to UX Research
• Tips on using toggle switches
• Design better data tables (2017)
• Usability Testing in 4 Simplified Steps
• The UX copywriter
• UXArchive - Library of mobile user flows.
• Linear's Superb User Experience (2020)
• How we built an app update flow our users love (2020)
• How we made our SaaS homepage cookie-free (2020) (HN)
• Best UX resources for 2021
• Reducing Cognitive Overload for a Better User Experience (2016)
• Free UX crash course
• Kickass UX - Learn UX/UI design.
• User Experience Database - Biggest free curated product design resources & tools.
• Interaction Design in a Nutshell - Dense, clearly defined, and small guide to interaction design.
• List of worst UX (2020)
• UX Christmas
• Dark Patterns Hall of Shame (HN)
• Types of Dark Pattern
• Why Jira Sucks (HN)
• Grumpy Website - Blog about design fails / gripes / anitpatterns.
• Built for Mars - UX matters. On a mission to help the world build better user experiences by demystifying UX.
• Pocket UX List - Small, but formidable, list of UX-related resources for people interested in learning more about various UX concepts.
• User power, not power users: htop and its design philosophy (2020) (HN)
• Page Flows - User flow design inspiration.
• A comprehensive list of UX design methods & deliverables (2021)
• UI & UX Design Resources
• Designing with Data: Improving the User Experience with User Flows (2021)
• Losing faith in UX (2021) (HN)
• Collection of Human Interface and Software Design Guides (2020)
• Apselon - UX/UI design service for a flat monthly fee.
• Tips for writing great microcopy
• “User engagement” is code for “addiction” (2021) (HN)
• How We Deliver Great Customer Experience Without a Support Team (2021)
• Fuckin' user interface design, I swear (2021) (HN)
• Guide to UX Research Methods
• SleekUI - UI Design Software Comparison. (HN)
• What publicly traded companies focus on great user experience and design? (2021)
• The Market for User Research Platforms (2021)
• UX Design Challenges
• uiwtf - Experimental laboratory for user interfaces.
• Guide user actions
• Ask HN: What are some good resources for a programmer to learn UI/UX design? (2021)
• Nice way to share feedback on a site
• Should one interface be designed for both novice and expert users? (2021)
• Tips to help your landing page convert (2021)
• Tips for improving UI
• Every UI/UX resources in one place
• On Building a Fluid User Interface by IG (2021)
• Can't Unsee (Lobsters)
• 50 tips to improve user interface (HN)
• UI Dev Newsletter - Hand-curated list of articles, tutorials, opinions, and tools related to User Interface development.
• Ask HN: Which tools/services have your favorite UI/UX? (2021)
• Rethinking the computer ‘desktop’ as a concept (2021) (HN) (Lobsters)
• Command Palette Interfaces
• 3 conversion killers in onboarding (2021)
• What I learnt roasting 200 landing pages (2021) (HN)
• User Inyerface - Worst-practice UI experiment. (HN)
• Reddit’s disrespectful design (2021) (HN)
• Tips for Better Signup / Login UX (2021) (HN)
• Some onboarding overviews/commentary
• Swipe Convert - Increase conversions, signups and revenue.
• Design Patterns
• Some Resources For Learning About HCI (2021)
• Reflect Onboarding
• The Rise Of User-Hostile Software (2021) (HN)
• How I Experience Web Today (HN)
• Software should convey a sense of calm (HN)
• Developer experience is user experience (2021) (HN)
• Why are there no "standard texts" on designing software interfaces? (2021)
• UX Mapping Methods: Study Guide
• When users never use the features they asked for (2021) (HN)
• How to build a compelling consumer app in 2021
• Post-Linear design (2021)
• Always take user's perspective/experience
• Pagination or infinite scrolling?
• First Principles of Interaction Design (2014)
• Why We Crave Software With Style Over "Branding" (2021) (Tweet)
• Apple Human Interface Guidelines: The Apple Desktop Interface (1987) (Tweet)
• Modern trend towards data-driven decision making (2021)
• Software with the most interesting self-serve onboarding flow (2021)
• The Golden Ratio and User-Interface Design (2021)
• Your users will do what you make easy (HN)
• Fewer options can create more optionality (2021)
• The shape of software (2021)
• UI & UX Design Tips by Jim Raptis
• Great How it Works Pages
• Letting users tick a ‘none’ checkbox (2021) (HN)
• 5 Prioritization Methods in UX Roadmapping (2021)
• Interfaces: Advanced Easing (HN)
• Command palettes: how typing commands became the norm again (HN)
• 9 changes took our signup rates from 5% to 16% on the homepage (2021)
• The power of defaults (2021)
• Ask HN: Why is today's Internet experience so user hostile? (2022)
• Ask HN: Why is software quality always decreasing? (2022)
• Click and Swap, our alternative to Drag and Drop (2022)
• Building like it's 1984: A comprehensive guide to creating intuitive context menus (2022)
• Settings are not a design failure (2022) (HN)
• Software Paper Cuts (2022)
• Adobe tricks users into a 12 month contract (2022) (HN)
• Ask HN: Software you hate but can't replace? (2022)
• Designing for a dev tool UX
• Why do we round corners? (2022) (HN)
• An unsolicited streaming app spec (2022) (HN)
• Annoying sub-menus and how to fix them
• Wordle is pretty damn smart in many subtle ways (2022) (HN)
• Making an interface feel "friendlier" Tips
• Mobile table design tips
• Principles of UI Design
• Every Screen in Your App Should Be a Scrolling View (2022) (Tweet)
• Mobile menu patterns
• Paper at 10 (2022)
• Checking in on Fast (2021) (Tweet)
• Design of This Website (2021) (HN)
• Creating a Zoom UI (2021)
• Designing dark mode without the headaches (2022)
• Types of Deceptive Design (HN)
• Computing Concepts for Designers - Computing concepts for designers. (YouTube)
• Fluid effects on iOS
• Designing a Command Palette
• Toast – Exploration of a notification component
• Tabs – Vercel's tab component with animated highlight on hover
• Examples of great Dev UX
• The Ultimate Guide To Push Notifications For Developers (2022)
• Apple UX Guide - Tips and best practices for building great experiences and writing sustainable code using Apple's UX Frameworks.
• Apple Human Interface Guidelines (Tweet)
• Optimizing For Feelings (2022) (HN)
• Want to be great at UX research? Take a cue from cultural anthropology (2022)
• The Most Satisfying Checkbox (HN)
• We need a flow chart editor that doesn't give you carpal tunnel (2022) (HN)
• UX Tip: Classify your Interactions into Obvious/Easy/Possible (2022) (Lobsters)
• UI/UX Learning Resources
• Curated list for UI/UX Designers
• 50+ practical UI/UX design tips
• The History of User Interfaces (HN)
• Comfy Software (2022) (Lobsters)
• Ask HN: How did you increase your UX skills? (2022)
• Instagram gets worse with dark patterns lifted from TikTok (2022) (HN)
• Ridd - YouTube
• Awesome Command Palette
• Designing undo/redo well
• Martians unveiled: infusing a new site with extraterrestrial tech and soul—Martian Chronicles (2022)
• UI & UX Micro-Tips: Best of 2022 (Tweet)
• Infinite Scrolling: When to Use It, When to Avoid It (2022) (HN)
• UX Checklists For Interface Designers (2022)
• End-user Programming (2019)
• Infinite Canvas - Tools that work the way we think.