Tools & Tips #002

A round up of UX toolkits, how-to tips and learning materials that I have benefited from and have really grown to love.


Designer thinking


What's in here?

This month's theme is focused on UI best practices and exploration on the latest tools as well as prioritization frameworks and resources for accessability design.


UI / UX tool kits

UX Frameworks

Resources



UI / UX TOOL KITS

Technology changes so fast and with it, digital products need to keep up with how it fits into the lifestyles and workflows of everyday people – including creators like Product Designers. In this section, you'll find tools and open source libraries to help you collaborate, explore or experiment.


Auditing & Organizing your learnings

As I start to embark on my next project, I'm conducting another UX/UI review of the product in order to get myself familiar with the interface and interaction design. These are a few resources and tips I discovered over the years to help me prepare and stay focused.

Preparation for UX/UI product audit

Usability Checklist

A guide to why the checklist points matter

Organizing Figma files

Figma file organization

PRO-TIP: After I finish with the audit, I organize it into a Miro board or Figma file (if there's already an existing file for audits like this) or I create a more presentational format for my colleagues – Whatever tool provides the best transparency and collaboration within the organization.


User behavior patterns

It's my personal belief that I lost a role because I responded to a question by saying that field validation should be done inline. The interviewer disagreed so when this article, 21 Rules for Intelligent Form Design landed in my inbox shortly after that interview, my confidence was restored! The article on form design also covers some tried and true tips for checkout flows, research survey forms and advice on how to increase response rate with your users.

That said, many of these how-to guides and best practices are written as opinion-editorial pieces. The learnings are usually based on data acquired from a specific product and its specific user base. Does your product use similar components? Or have a similar audience? Find out!

Preventing Data Loss on Forms & Modals

Emerging Social Design Patterns

Making Better App Icons

A Tale of 2 Cultures: UI Differences between Chinese and English apps



UX FRAMEWORKS

Planning a workshop can be a challenge but these resources help moderators create workshops on short deadlines and help facilitators prepare – from team-building to creative brainstorming.


RICE formula

One of the last design sprints I facilitated generated outcomes that required the teams to zoom out on the problem and start over. I thought it was a success since the stakeholders had fun and aligned on many solutions. This made some execs very unhappy because they had a clear, albeit uncommunicated, outcome in mind and wanted the team to move forward on that single solution. That issue, combined with the struggle to prioritize all the solutions, blocked the team from implementing anything.




Trust is a tricky thing to balance when you're trying to build successful solutions in an organization that neglects team building. This article, Trust is the Process: Why Frameworks don't Guarantee Good Results, highlights how results are unreliable if you try to use design workshops to replace team-building exercises. Another takeaway is that every workshop achieves the best results when it's repeatedly used within the team. This enables them to become a more cohesive team. The overall process and workshops should be evaluated by the participants in order to identify what's working and what's not working well for them.


7 Retrospective Templates

NNGroup's Informing UX Decisions using Prioritization Matrices

Prioritization made Simple using RICE



Reading is fundamental gif

RESOURCES

It's not enough to just copy UI guidelines and UX logic from popular products – Understanding the function of design and psychology can help you design better tests, get unbiased learnings and build more strategically.


Ethical design

Tarot cards for Tech – Get a reading and see where you are on topics like social justice, ethical design, environment and learn how to make positive change

DesignEthically.com/toolkits

Accessibility tools

ColorContrast.cc

Colorable.jxnblk.com

A11yproject.com/checklist

Web Content Accessibility Guidelines