#430: UX Guides, Templates and Career Ladders

30-60-90 day plan for designers, UX guidelines, user journey templates and UX research glossary. Issue #430 • November 7, 2023 • [View in the browser]( [Smashing Newsletter]( Bonne soirée Smashing Friends, UX has become incredibly complex and multi-faceted over the years. We have so many concepts, abbreviations and methodologies that we often lose ourselves in all the fine details and differences between them. In this newsletter, we hope to bring some clarity around UX terminology, the business side of design, UX career ladders and a few UX guidelines and templates. If you’d like to dive deeper, we also cover plenty of design patterns in [Smart Interface Design Patterns]( by yours truly, with early-birds now available as well. [Smashing Meets Go Green]( We also have a few free community events coming up shortly: - [Smashing Meets Go Green]( (Dec 7), free online community meet-up on digital sustainability, - [Smashing Workshops 2023–2024]( with new in-person workshops coming up soon, - [SmashingConf Freiburg 2024]( 🇩🇪 (Sep 9–11) - [SmashingConf New York 2024]( 🇺🇸 (Oct 7–10) - [SmashingConf Antwerp 2024]( 🇧🇪 (Oct 28–31) We’d be absolutely delighted to meet you online and in-person this and next year. And we sincerely wish you a lot of hope, optimism, positive energy and love these days. — [Vitaly]( --------------------------------------------------------------- 1. Progress Steps UX Only a few things are more frustrating than a progress bar that seems to be stuck. Complex forms often have conditional sections, so users end up going in circles, staying on the same step as they move between sections. So how do we design better progress steps? Gov.uk [suggests]( starting without a progress indicator altogether. Tell users what they need and how much time it will take. Show progress as “Step [X] out of [Y]” with a text label. Keep the active label visible but hide future and past steps. [Progress Steps UX]( For complex forms, Goldman Sachs [suggests]( including text labels under each step. Underline labels to make it clear that users can use them to navigate. Design 6 states: incomplete, active, complete, error, disabled and warning. And consider using vertical progress steps to always display all sub-steps. You can find a more thorough overview in [Designing Better Progress Steps UX]( by yours truly, along with useful links and resources to get started. (vf) --------------------------------------------------------------- 2. UX Career Ladders When we think about our skills and growth, we often think about career ladders. But the problem with ladders is that you either go up, down or fall off. But what if we pursue a net (not a ladder). Move up. Move down. Move sideways. Promoting just the vertical progression doesn’t work with diverse careers ahead of us all. [UX Career Ladders]( In a fantastic series on [Shaping Design]( Jason Mesut explores frameworks and tools to help designers and design teams shape their careers. With a competency model, design leadership mapping and workshops to prioritize values and map your team’s and your own design values. If you are looking for more details, Aaron James has put together a comprehensive [path to becoming a senior UX designer]( and Figma provides [Product Design & Writing Career Levels]( too. A wonderful reminder that every minute you spend to better understand where you stand and how you want to grow is a minute well-invested. (vf) --------------------------------------------------------------- 3. UX Glossary What are attitudinal UX research methods and contextual inquiry again? And what are SUS, SEQ and NASA-TLX? There are many terms, concepts and abbreviations in UX, so wouldn’t it be great to have one single place to have them all? [UX Glossary]( Raluca Budiu from the Norman Nielsen Group has been putting together UX glossaries — for [UX research]( ([PDF]( [quantitative research]( ([PDF]( [lean UX and agile]( ([PDF](. The articles and PDFs explain each term in a lot of detail, with useful pointers and related terms. A neat little helper to keep close, with reliable and concise explanations, all in one single place. (vf) --------------------------------------------------------------- From our sponsor Unleash Your UX Design Potential at UC San Diego Division of Extended Studies [UC San Diego]( Elevate your UX Design expertise while building an impressive portfolio designed to help you advance your career or land a UX design role. Taught by industry experts, this program has all you need to gain practical industry knowledge. [Watch our information session]( to learn more! --------------------------------------------------------------- 4. Business Thinking for Designers Design is rarely the central part of a business. Just like many others, typically it’s a satellite that has a significant impact, but often that impact is quite difficult to visualize — to explain design decisions, prove their impact and connect design initiatives with a business value. [Business Thinking for Designers]( To make an impact, we need to speak the language of management and understand how to argue about design through the lens of business. [Business Thinking For Designers]( (free eBook) is a wonderfully practical guide to business for designers, with strategies to effectively communicate with stakeholders and techniques that you can put right to work. Kindly put it together by Ryan Rumsey. You can also [download all chapters and audio for free]( (but registration is required). It’s a wonderful book, and highly recommended! (vf) --------------------------------------------------------------- 5. Upcoming Workshops and Conferences Of course we run [online workshops on frontend and design]( be it accessibility, performance, or design patterns. In fact, we have a couple of workshops coming up soon, and we thought that, you know, you might want to join in as well. [Smashing Online Workshops]( With [online workshops]( we aim to give you the same experience and access to experts as in an in-person workshop from wherever you are. As always, here’s a quick overview: - [Accessibility for Designers]( UX with Stéphanie Walter. Nov 6–15 - [Building Modern HTML Emails]( Dev with Rémi Parmentier. Nov 9–17 - [Advanced Modern CSS Masterclass]( Dev with Manuel Matuzović. Nov 27 – Dec 11 - [Successful Design Systems]( Workflow with Brad Frost. Nov 28 – Dec 12 - [Design Management Masterclass]( UX with Slava Shestopalov. Nov 30 – Dec 8 - [Streamlining Your Websites Content]( Workflow with Paul Boag. Dec 7–15 - [Smart Interface Design Patterns]( UX 9h-video + Live UX Training with Vitaly Friedman - [Jump to all workshops →]( --------------------------------------------------------------- 6. 30-60-90 Day Plan For Designers So you are starting as a UX designer in a new company. Where do you start? How do you make sure you make all the right connections and, gather all the right data, and don’t miss something critical? [30-60-90 Day Plan For Designers]( [First 90 Days Plan For Designers]( by yours truly provides a thorough overview of useful checklists, guides and Notion, Trello and Miro templates to get started in a new role — as a UX designer or UX researcher. Hopefully, there will be some useful pointers for you to get started on the right foot! (vf) --------------------------------------------------------------- From our sponsor Build With The Power Of Code — Without Having To Writing Any [Webflow]( Take control of HTML, CSS, and JavaScript in a visual canvas. Webflow generates clean, semantic code that’s ready to publish or hand to developers. [Get started — it’s free](. --------------------------------------------------------------- 7. Journey Mapping Templates To visualize user journeys, we typically design user journey maps. They map actions, pain points, jobs to be done, opportunities, emotional journeys, and next steps. Creating one from scratch is quite time-consuming, but fortunately, there is no shortage of free tools to help you off the ground. [Journey Mapping Template]( NN/g recently released a thorough interactive [Journey Mapping Guide]( to showcase user research, explain customer journeys, and engage with stakeholders. You can also use the [End-To-End User Experience Map]( by Turtle.design, a [User Journey Map Template]( by Estefanía Montaña B, and a [User Journey Map Miro template]( by Steph Walter. Happy mapping, everyone! (vf) --------------------------------------------------------------- 8. Smashing Books 📚 Promoting best practices and providing you with practical tips to master your daily coding and design challenges has always been at the core of everything we do at Smashing. In the past few years, we were very lucky to have worked together with some talented, caring people from the web community to publish their wealth of experience as [printed books](. Have you checked them out already? - [Understanding Privacy]( by Heather Burns - [Touch Design for Mobile Interfaces]( by Steven Hoober - [Image Optimization]( by Addy Osmani - [Jump to all books →]( [Success At Scale]( … and we’re currently working on a new book: [Success At Scale]( shipping in fall. [Pre-order your copy]( or [browse the complete library](. --------------------------------------------------------------- 9. Recent Smashing Articles - [Answering Common Questions About Interpreting Page Speed Reports]( - [In Search Of The Ideal Privacy Icon]( - [Tales Of November (2023 Wallpapers Edition)]( - [The Fight For The Main Thread]( - [Read more on Smashing Magazine →]( --------------------------------------------------------------- That’s All, Folks! Thank you so much for reading and for your support in helping us keep the web dev and design community strong with our newsletter. See you next time! --------------------------------------------------------------- This newsletter issue was written and edited by Cosima Mielke (cm), Vitaly Friedman (vf) and Iris LjeÅ¡njanin (il). Sent to truly [smashing]( readers via [Mailchimp](. We sincerely appreciate your kind support. You rock. [Follow us on Twitter]( • [Join us on Facebook]( Weekly issues with useful tips for web devs. Email: newsletter@smashingmagazine.com. [unsubscribe]( • [update preferences]( • [view in your browser](