Smashing Magazine πŸ‡ΊπŸ‡¦ πŸ³οΈβ€πŸŒˆ Profile picture
An online magazine for designers and web developers. Questions? We've got your back: @SmashingSupport, @SmashingConf. Curated by Iris, Vitaly and the team.
✨ Jeff Triplett ✨ Profile picture makeyko Profile picture 2 subscribed
Jul 8, 2020 β€’ 8 tweets β€’ 4 min read
All The Things I Think About When I Think About Autocomplete

01 β€” Is search collapsed or visible at all times?
02 β€” Do we want search to be prominent or hidden?
03 β€” Is search box actually a search box?
04 β€” Do we explain various types of search (symptom, item number)? 05 β€” Is it possible to pre-select a department?
06 β€” Is search input keyboard-focusable?
07 β€” What changes when the input field is in focus?
08 β€” Do we darken the rest of the screen to bring search into focus?
09 β€” Do we show popular searches, products or categories on focus?
May 26, 2020 β€’ 7 tweets β€’ 3 min read
Everything I think about when I think about donation forms. #uxpatterns

01 β€” What audiences are we targeting with the donation form?
02 β€” What purpose of donation would resonate best with our audience?
03 β€” How do we communicate that purpose to the audience visibly? 04 β€” Do we highlight how we use donations (case studies, videos etc.)?
05 β€” Do we include any testimonials or stories next to the donation form?
06 β€” Do we allow visitors to choose the cause?
07 β€” Do we provide an option to make a donation in honor or in memory of someone?
Apr 20, 2020 β€’ 14 tweets β€’ 7 min read
All the things I think about when I think about web forms. #uxpatterns

01 β€” What’s the absolute minimum user input we need for new customers to get started?
02 β€” When is the right time and place to ask users to verify critical input (email, password, permissions)? 03 β€” For each piece of data, what’s the best form element to collect it fast and accurately?
04 β€” For sensitive data input (e.g. phone number), do we explain why we need it?
05 β€” Are there any form elements which need hints (e.g. password requirements, username)?
Apr 9, 2020 β€’ 17 tweets β€’ 8 min read
Everything I think about when I think about pricing plans. #uxpatterns

1. What copy do we include above pricing plans (strong one-liner, useful byline)?
2. Can we include the number of companies/customers that have already signed up? 3. Can we highlight logos of prominent brands that already use our service?
4. How many plans do we have, and which one do we want to sell?
5. What are the difference between the plans? Are they targeting a different audience?
Apr 8, 2020 β€’ 6 tweets β€’ 3 min read
Everything I think about when I think about date pickers. #uxpatterns

01 β€” Date picker, a date-range picker or a time picker?
02 β€” Should it be activated when a user clicks on input/icon?
03 β€” Should we combine day/month/year into one input field? 04 β€” Should the date picker contain default preselected values?
05 β€” Should we include prev day/today/next day nav?
06 β€” How do we design the navigation between months and years?
07 β€” What happens if a user clicks on the empty bar?
08 β€” How do we communicate unavailable options?
Apr 6, 2020 β€’ 9 tweets β€’ 5 min read
Everything I think about when I think about maps. #uxpatterns

01 β€” What kind of map/chart are we designing (geography, floor plan, seat map)?
02 β€” How much space do we reserve for it in our UI (mobile/desktop)?
03 β€” Will the map/chart change over time (elections, live events)? 04 β€” Do we have any levels, planes, or layers that users need to navigate between?
05 β€” If yes, how many? How do we design the navigation?
06 β€” Will the map/chart contain markers, labels, and distinct regions?
07 β€” Do they all have the same weight, or are there any critical ones?
Mar 27, 2020 β€’ 8 tweets β€’ 4 min read
Everything I think about when I think about feature comparison. #uxpatterns

01 β€” How do you indicate that comparison is possible?
02 β€” What happens when the first item is added for comparison?
03 β€” Have we disabled the option to compare only one selected item? 04 β€” How do we highlight a product selected for comparison?
05 β€” Do we display a comparison bar or a modal after adding to compare?
06 β€” How do users unselect a selected option?
07 β€” Should we suggest products to compare at some point?
Mar 26, 2020 β€’ 9 tweets β€’ 5 min read
Everything I think about when I think about tables. #uxpatterns

01 β€” Do we really need to display this table as a table on mobile?
02 β€” Are some rows/columns more important than others?
03 β€” What data points are most critical to our customers? 04 β€” Can we hide some columns while showing the important ones?
05 β€” Do we add steppers to navigate through columns or rows predictably?
06 β€” Do we add controls to select what columns/rows users want to see?
07 β€” Do we allow users to display all columns/rows if they want to?
Mar 25, 2020 β€’ 8 tweets β€’ 4 min read
Everything I think about when thinking about filters. #uxpatterns

01 β€” Can we avoid a filter icon and show filters as they are?
02 β€” If not, what icon do we choose to indicate filtering?
03 β€” Is the icon plus padding large enough for comfortable tapping? 04 β€” Do we put the icon at the top, bottom, or floating (mobile/desktop)?
05 β€” What exactly happens when the user clicks/taps on the icon?
06 β€” How will the icon change on tap/click?
07 β€” Will we have some sort of animation or transition on click?
Mar 19, 2020 β€’ 7 tweets β€’ 2 min read
Everything I think about when thinking about navigation.

01 β€” What critical navigation do we always need to expose (filters, cart, topics)?

02 β€” Are critical CTAs optimized for mobile (float at the bottom)?

03 β€” Are critical CTAs optimized for desktop (upper right corner)? The navigation design checklist, items 01–13The navigation design checklist, items 14–27 04 β€” Do we always display search box to increase searches?

05 β€” Do we always display some navigation to raise engagement?

06 β€” Do we use β€œmore/less” pattern to show/hide more navigation?

07 β€” Do we display breadcrumbs to jump to the parent category?
Jan 14, 2019 β€’ 8 tweets β€’ 3 min read
[Thread] There are a few options for fraud prevention strategy against spam bots: honey pots, time traps, "human" questions, CAPTCHA (among others). Don't offload your technical issues to users by asking them to validate they are humans before you *absolutely* have to. Any security check might cause friction and abandonment, and potentially raises accessibility concerns. Before using severe mechanisms or third-party scripts, try simple options and measure their success.
Dec 11, 2018 β€’ 9 tweets β€’ 3 min read
Some things need to be said. I deeply love community/non-profit events, local groups and meet-ups β€” all run on incredible efforts of humble, kind people working hard to bring people together. These are incredible people doing incredible work. This message isn’t for them. At the same time, I'm very sad to see a huge number of commercial events (with ticket prices beyond $450) that expect speakers to speak for free and don't cover flights and accommodation. That's a toxic, broken culture with a fundamental lack of respect for time, effort and work.
Mar 23, 2018 β€’ 14 tweets β€’ 4 min read
A short thread about some of the unusual things I learned about customers behavior in eCommerce recently. πŸ‘‡ We need to consider difficult conditions when designing eCommerce UX. All these things matter:

1. Distracted
2. Tired or hungry
3. Time of the day/week
4. Level of motivation
5. Amount of cognitive effort
6. Wish for instant gratification
7. Situation (e.g. time pressure)