Smashing Magazine - #452: Design Workflow

How to choose the right idea, navigate difficult conversations and communicate design. Issue #452 Apr 16, 2024 View in the browser

Smashing Newsletter

Iyi akşamlar Smashing Friends,

Design workflow is always tricky to get right. Despite all the incredible tooling and UX methodologies, finding just the right way to do good work is always challenging. It’s challenging because it involves the way people collaborate, communicate, make decisions, and navigate difficult conversations, among many things.

Of course, there is no perfect design workflow. However, the best work doesn’t emerge through an ideal process. Often, it appears when the team has time, space, and a supportive culture that enables and motivates everyone to do their best work. That’s when the design process emerges on its own rather than adopting existing frameworks.

In this newsletter, we’ll explore best practices for better design, how to choose the right idea, how to communicate design, and how to find and make time to design. We hope it will help you discover a better design workflow for you and for your team.

Smashing Workshops

On our end, we warmheartedly welcome you to our upcoming online workshops on design and front-end — with new workshops on design system process with Nathan Curtis, behavioral design with Susan Weinschenk, and accessibility for designers with Steph Walter.

Ah, and of course, we have a lovely SmashingConf Design & UX coming up later this year in the beautiful city of Antwerp, Belgium 🇧🇪 — along with waffles, chocolates, and a dash of Belgian fries, of course! We’d be absolutely delighted to welcome you there! Jump to all speakers and topics.

Bring your friends, colleagues, neighbors, and total strangers — what a remarkable experience it will be! 🎉🥳

Vitaly


1. Design Good Practices

Structure and organization might not sound like the most exciting things, but investing your time in properly arranging and naming your files can prevent slow-downs and unmanageable situations in the long term. To help you name and structure your files and components and organize your design documents, Javier Cuello created Design Good Practices.

Design Good Practices

Design Good Practices features guidelines and practical examples for keeping your design files in order. You’ll learn what makes an effective name, how to organize pages, frames, artboards, layers, and components, and how to document design specifications, practices, and workflows to keep everyone in the team aligned. A great resource to turn a creative mess into a logical, predictable, and scalable way of working. (cm)


2. How To Choose The Right Idea

When you’re about to tackle a design challenge, you might need better insight into what brings real value to your end-users. The Kano Model is a great opportunity to prioritize features based on the degree to which they are likely to satisfy and delight customers. If you’re new to the Kano Model, Eva Hörner wrote a case study on how she and the design team at CarePay applied the model to gain a user’s perspective when prioritizing features.

The ultimate guide to the Kano Model

In the case study, Eva discusses the basics of creating a Kano survey, how they analyzed the results, and the key takeaways from the Kano Model analysis. As it turns out, in the case of CarePay, the analysis revealed that their end-users prioritize differently than the design team had expected. A helpful strategy to gain precious insights into what customers want so you can make the right decisions for your product. (cm)


3. Navigating Tough Conversations

“We don’t have time for that.” “That’s just an edge case.” “We’ll focus on that later.” Maybe you’ve heard some of these phrases before in conversations with cross-disciplinary teams. Emma Siegel wrote a friendly guide on how to navigate tricky conversations. It focuses on defending accessibility and inclusive design, but some of the ideas can be applied to tough discussions around other topics as well.

Inclusive Design Advocacy: A Guide to Navigating Tough Conversations with Your Teams

In her guide, Emma shares tips on how to frame the conversation around inclusive design and scenarios you might run into when collaborating with design and product teams. For each scenario, she provides talking points and calls to action to bring up. Practical tips and a great reminder that being an advocate is not just disagreements and being right, but an opportunity for growth and education. (cm)


From our sponsor

Build Your GraphQL Content API. Instantly.

HYGRAPH
Define your content schema, create or integrate other content sources, and deliver content to any channel using a powerful GraphQL API. With Hygraph, your content is hosted in your preferred data center and served from the world’s fastest CDN. Plus, Hygraph fits right into your tech stack, supporting your favorite frontend frameworks, systems, and APIs. Create your free account.


4. How To Communicate Design

“Good design is invisible.” Like many designers, Kike Peña has been practicing this mantra all his career. But after facing unexpected results from users several times, he started to question if the success of a user experience relies only on a good interface design solution. Kike came to the conclusion that you need another layer to make a design even more robust and accepted: a proper communication plan.

How To Communicate Design

Kike advocates for a combination of an invisible design (i.e., a design that should be free of explanation) and effective communication. Of course, not everything needs a communication plan, but it is a part of creating a design strategy to think about how and when to communicate things to make them relevant to users. To give you a better idea of when accompanying communication is necessary — and what it can look like — Kike created a graphic that visualizes design complexity and the level of communication needed. (cm)


5. Upcoming Workshops and Conferences

That’s right! 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 Events
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:


6. The 11-Star Experience Framework

Have you heard of the 11-Star Experience already? Airbnb’s CEO and co-founder Brian Chesky is famous for the exercise. It takes a part of your user experience and extrapolates it to the extreme in both directions to, finally, find the sweet spot: the best feasible UX. If you want to give it a try, Reid Hoffmann summarized everything you need to know to run the exercise with your team.

11-Star Experience

The idea behind the 11-Star Experience is simple yet effective: Imagine what the worst experience with your product would look like (1-star experience), what the most magical experience would look like (11-star experience), and everything in between. Think big and stretch the limits of what’s possible. The 9-, 10-, and 11-star experiences might not be feasible, but by designing the extreme you can come backward and find the best experience: the one that is delightful and feasible. (cm)


From our sponsor

Experience Penpot Fest: The Design, Code And Open-Source Event In Barcelona

Penpot Fest
Calling all Design, Code & Open Source fans! Don’t miss Penpot Fest’s second edition in Barcelona, June 5–7th. This exciting event is packed with: an evening welcome party; a top line-up of speakers from all around the world (featuring Smashing Magazine’s collaborator Mikolaj Dobrucki); workshops to get from zero to hero in Penpot; coffee breaks & chill-out time to connect with great peers; and a memorable sunset cocktail on Thursday evening. By using the code SMASHMAG, you’ll unlock a 50% discount on the standard ticket price (after Early Bird tickets have sold out). Get your Penpot Fest tickets!


7. Creating Space For Effective Work

50-30-20. According to Matt Bond, former Lead Designer at Dropbox, this is the ideal time usage for a designer to avoid burnout, or, at least, to reduce the likelihood of it happening. In his post “Avoiding burnout at a tech company,” he takes a closer look at design’s involvement during a project and how to create space for effective work.

Avoiding burn out at a tech company

As Matt points out, to be effective, designers should spend around 50–60% of their time on a single big and impactful project and around 30% of time on a project that helps the greater design org — it could be contributing to pattern libraries, creating a playbook of processes and techniques, or investing time in process overhauls and refinements, culture improvements, or recruiting.

The remaining 20% of time are kept free for the things that pop up. Of course, the 50-30-20 allocation is the ideal and not always possible, but it gives you a better idea of what to aim for to give designers the space they need to do good work. (cm)


8. News From The Smashing Library 📚

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?

Success At Scale
It’s here, and it’s shipping! Success At Scale, a new book by Addy Osmani. Get the book or browse the complete library.


9. Recent Smashing Articles


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

unsubscribe update preferences view in your browser

Older messages

#451: Interface Design

Tuesday, April 9, 2024

100 Figma Design Tips, UX challenges, Icon design, context menus, Confirm or Undo. Issue #451 • Apr 9, 2024 • View in the browser Smashing Newsletter Dobrý večer Smashing Friends, If you spend a lot of

#450: Localization and Internationalization

Tuesday, April 2, 2024

Issue #450 • Apr 2, 2024 • View in the browser Smashing Newsletter Iyi akşamlar Smashing Friends, How would you go around localizing your product? When we speak of localization, we think about how to

#449: UX Research

Tuesday, March 26, 2024

UX research impact, research invite emails, research without access to users, and UX research methods cheat sheet. Issue #449 • Mar 26, 2024 • View in the browser Smashing Newsletter Joh-eun jeonyeog-

#448: AI Interfaces

Tuesday, March 19, 2024

Design patterns for AI interfaces, EU AI Act, generative search UX, AI and design systems. Issue #448 • Mar 19, 2024 • View in the browser Smashing Newsletter Ahoy Smashing Friends, It was April 29,

#447: Web Performance

Tuesday, March 12, 2024

Interaction To Next Paint, web font analyzer, web performance course, and Tailwind vs. Semantic CSS. Issue #447 • Mar 12, 2024 • View in the browser Smashing Newsletter Konbanwa Smashing Friends,

You Might Also Like

Accessibility Weekly #394: Images as the First Thing in a Button or Link

Monday, April 29, 2024

April 29, 2024 • Issue #394 View this issue online or browse the full issue archive. Featured: Images as the first thing in a button or link "An accessibility problem I encounter regularly is

My product prioritization framework

Sunday, April 28, 2024

Issue 192: How I triage strategy ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏ ͏

Cascade, HTMX, Sponge Furniture, Meaning of Color, Flipbook

Friday, April 26, 2024

The 5 best design links, every day. Curated by a selection of great editors. Email not displaying properly? View browser version. Sidebar April 26 2024 A primer on the cascade and specificity piccalil.

9 Trends From Milan We Can’t Stop Thinking About

Thursday, April 25, 2024

View in your browser | Update your preferences ADPro Even More From Milan Design Week Each year, the design world convenes in Milan—and that applies to us at AD, too. For the third year running, our

Subframe, Attributes vs Properties, Front End Handbook, aspect-ratio, GenAI

Thursday, April 25, 2024

The 5 best design links, every day. Curated by a selection of great editors. Email not displaying properly? View browser version. Sidebar April 25 2024 Subframe subframe.com Subframe is a design-to-

Ritmo, Climate Change, Icons & Typefaces, Click Wheel JS, CarPlay

Wednesday, April 24, 2024

The 5 best design links, every day. Curated by a selection of great editors. Email not displaying properly? View browser version. Sidebar April 24 2024 Meet Ritmo, Musixmatch's cross-platform

Why Jake Arnold Doesn’t Text Clients

Tuesday, April 23, 2024

View in your browser | Update your preferences We've had a remodel! From now on, you'll be hearing from AD PRO in your inbox twice a week—once with a deep dive into trends to watch and subjects

The secret ingredient to media success

Tuesday, April 23, 2024

PR tips from our founder Nora Wolf In this month's edition is all about *the most important* element of successful media outreach—photography. You may have some photos, but if the backgrounds are

#453: Design Systems

Tuesday, April 23, 2024

Design system generator, types of design systems and how to consolidate design systems. Issue #453 • Apr 23, 2024 • View in the browser Smashing Newsletter Buổi tối vui vẻ Smashing Friends, Ah, design

👨‍🏫 Striking Educational Website Designs + 🏆 Challenge Updates

Tuesday, April 23, 2024

Your UpLabs Design Updates Await! Let's Get Going! 🎨 Firstly, let's congratulate Mariana Gameiro, the winner of our latest 👩‍💻 SheCodes Website Redesign Challenge! Congratulations!! Secondly,