As UX practitioners, we tend to present user-centered design based on our education and experience, but we don’t deliver any supporting documentation to help our partners (product managers, project managers, development and IT teams, etc.) understand our rationale.
Based on conversations with colleagues, I thought it could be useful to comb through some of my favorite UX and usability articles to quickly cite authoritative research to bolster our deliverables.
I’ve also listed some of the podcasts, interaction tools, blogs and other miscellaneous resources I use to produce work and stay inspired.
Minimize cognitive load (brain power) so users can quickly and effectively navigate the site without having to process tons of information.
IDEO's overview about Design Thinking
Content & Copywriting
Use plain language in all content, especially error, instructional or advisory content. Older users especially have difficulty understanding “techy” terms. They also don’t want to comprehend business jargon.
When writing links and structuring pages, group relevant pages into one section instead of dividing content up to increase a perceived number of choices.
Always use labels and advisory or instructional text outside of the form, not inside. When inside, it strains users’ short-term memory and makes it difficult to complete and validate information.
Web form validation should be designed to reduce errors by clearly labeling fields, identifying required vs. optional content, instantly validating fields on lost focus (when possible)
Labeling fields on top reduces completion times, but if space is an issue, right-aligning text to the left of the field is the next best method
Inline validation (as opposed to validating onSubmit of a page) can help people complete forms with fewer errors and increased speed.
Images, Pictures & Symbols
Larger product images are good as users can easily view product features and details which helps the shopping and comparison process.
A primer about semiotics, and why you should know the difference between “sign” and “signifier”
Interactions & Gestures
Ensure that interactions are obvious enough for users to notice and that the UI doesn’t move too fast.
iPad / tablet transitions and how to reflect them in a storyboard or design
Search & Navigation
Minimizing global navigation on a desktop site is not ideal for all sites, as it reduces users’ ability to efficiently switch between top-level categories.
When using filters, only show the user the applicable categories to filter against. If a filter contains 0 items, don’t display it.
UIE Brainsparks – User Interface Engineering’s podcast about all things experience design
Giant Robots Smashing Into Other Giant Robots– It’s aimed more at a product manager / developer base, but has great talks about the holistic lifecycle of the roles and processes that go in to making a feature roll-out actually happen. Great to have that well-rounded insight as we work with partners to develop, QA, test, assess, market, etc. products.
99% Invisible – More inspirational than educational from a teaching / lecture perspective, but has a lot to do with the history and significance of architecture and graphic design.
Sidebar.io – 5 daily links to design / UX / development articles and sites
UX Stack Exchange (more as a forum for ask / answer from peers, not necessarily authoritative)
Interaction / Prototyping Tools
Sketch (Mac only) – It’s great out of the box, and even better when you use some of the available plugins. It’s like a way cheaper version of Photoshop for folks who just need to create UI designs. Love the ability to create storyboards and mirror directly to iOS devices. Go-to visual design tool for freelance projects.
Framer.js – Requires a lot of knowledge about coding, but once you have the basics down, you can create amazingly interactive prototypes. Create visuals in Sketch, import and associate interactions. Mirroring to devices allows you the ability to quickly test on actual devices.
Axure – Great for creating adaptive wireframes and high-fidelity visual design, but requires a pretty significant learning process and it’s still a little dense when you’re trying to create working prototypes. Still my go-to tool in the corporate workplace and – I think – the best tool for low-fidelity wireframes and concepts.
InVision – Design in Sketch, then export visuals to InVision to associate transitions to static images. A little bit of a learning curve but much faster to stand up a sharp prototype than Framer.js.
XCode – Exclusively for iOS app development, it’s complicated but hours of familiarizing yourself with the tool will result in the ability to publish an actual, working app with more utility than a prototype and you get a better insight into actual app development which is a totally different animal than prototyping.