Web design isn’t just about making things “look nice.” It’s about solving problems, ensuring usability, and creating a pleasant experience for users. Cool Features™ are useless if nobody can find them.
1. What do they want from me?
TLDR: Understand what needs to be done and why (before you start randomly moving rectangles).
Here are the questions you could ask people who pay you:
1. About the Project: Understand the Big Picture
- What is the primary goal of this design/project?
- Who are the target users?
- What problems are we solving for them?
- How does this project align with the company’s goals?
- Are there any key metrics or KPIs we’re focusing on?
2. About the Users: Get to Know the Audience
- Who will use this product? (Age, profession, tech-savviness, etc.)
- What are their pain points?
- What’s their typical workflow or journey?
- What devices/platforms do they use? (Desktop, mobile, tablet?)
- Are there accessibility considerations (e.g., disabilities or specific needs)?
3. About the Content: What Goes in the Design?
- What content do we already have? Is it finalized?
- Are there specific requirements for images, text, or videos?
- Is there a brand style guide or design system we should follow?
- Are there any must-have features or content elements?
4. About Constraints: Know Your Boundaries
- What’s the deadline for this project?
- Are there technical constraints I need to consider?
- Are there budget limitations (e.g., no time/money for custom assets)?
- Who makes the final decision on design approval?
5. About the Competition: Learn from Others
- Who are the key competitors or benchmarks for this project?
- Are there examples of designs/products we should aspire to?
- What do users like/dislike about competitor products?
6. About the Process: Avoid Surprises Later
- Who are the stakeholders, and how involved will they be?
- What’s the feedback process?
- How often will we have check-ins or design reviews?
- What happens after design handoff? (E.g., am I involved in QA?)
- Are there any past designs or projects I can look at for context?
7. About Success: Define the Win
- What will make this project a success?
- What are the top priorities (e.g., usability, speed, aesthetics)?
- Are there measurable goals? (E.g., increase conversions by 20%, reduce drop-offs by 10%.)
8. Nice-to-Have: Extra Questions That Can Save You
- What are the risks or challenges for this project?
- Are there any stakeholders/users with strong opinions I should know about?
- Do you have examples of designs you love (or hate)?
- Is there flexibility in scope if we run into issues?
⚡ Pro Tip: If you feel overwhelmed, just start with:
- "What’s the main goal?"
- "Who are the users?"
- "What’s the deadline?"
2. Stalk Your Users (But in a Nice Way)
...because 'I feel like it' isn’t a strategy
TLDR: Stop guessing and figure out what users actually need.
Let’s be real — designing based on gut feelings is a shortcut to building something no one wants. You’re not the user (unless you are, in which case... lucky you), so it’s time to dig into what actual users need, want, and struggle with. No more assumptions. No more "I think this looks good." Let the data and feedback speak.
-
Learn to spot ugly before you make ugly: Look at how others solve similar problems. Identify what works and what doesn’t
- Exploring well-designed websites. (ex: Dribble)
- Break down designs:
- Ask yourself: Why does this work? Why does this layout feel intuitive?
- Notice patterns like spacing, alignment, and typography hierarchy.
- Gather feedback:
- Surveys (send around a url and be prepared to send an endless amount of reminder emails)
- Actually talk to people, you introvert
bonus: ask why five times
User says: "This feature is confusing." Cool.
Why?
"It’s hard to find." Why?
"It’s hidden in the menu." Why?
"Because the menu is overloaded." Why?
"Because we added everything users asked for." WHY?!
See? Keep asking. The root problem is rarely on the surface.
2.1 About Surveys
Okay, so you’ve stalked your users (nicely), checked out competitor designs, and maybe even stared at some analytics long enough to question your life choices. Now it’s time to get real feedback.
Surveys are one of the easiest ways to collect direct insights from users. But here’s the catch — badly designed surveys will give you garbage data, and garbage data leads to garbage design. So let’s avoid that, yeah?
We’re not here to annoy users with endless forms. We’re here to ask the right questions, in the right way, to get answers that actually help.
Up next: how to create surveys that don’t suck and actually help you build something users will love.
🤔 Why bother with the Kano Model?
Because not all features are created equal.
Here’s the thing: you can’t (and shouldn’t!) build every feature users suggest. Some features make users happy, some are just expected, and some… well, they’re just fluff. The Kano Model helps you figure out which is which, so you can prioritize features that actually make an impact.
Instead of guessing what’s important, the Kano Model gives structure to your research. It helps you balance between must-haves, wow-factors, and things nobody cares about. Smart, right?
🌻 The 5 Kano Model Categories
-
Must-Have Features (Basic Needs)
- Users expect these features by default.
- If they’re missing, users will be pissed.
- If they’re there, users won’t even notice (because it’s the bare minimum).
Example: A banking app that doesn’t show your balance? Rage.
Goal: Don’t screw these up.
-
One-Dimensional Features (Performance Needs)
- The more you improve these, the happier users get.
- The worse they are, the angrier users become.
Example: Faster loading speed, better battery life.
Goal: Optimize the hell out of these.
-
Attractive Features (Delighters)
- Users don’t expect them, but when they’re there — instant wow.
- If they’re missing, no one complains. If they’re present, users fall in love.
Example: Instagram’s photo filters when they first launched.
Goal: Sprinkle these in for maximum user joy.
-
Indifferent Features
- Users don’t care if these features exist or not.
- They don’t add or take away any value.
Example: An app that lets you change button shapes. Cool? Sure. Useful? Meh.
Goal: Don’t waste time here.
-
Undesirable Features (Reverse Needs)
- Features that actively annoy users.
- The more you push them, the worse the experience.
Example: Auto-playing videos with sound. Pop-up ads.
Goal: Avoid these like the plague.
🌻 Quick Example of Applying Kano
Imagine you're building a simple note-taking app:
- Must-Have: Ability to save and edit notes
- One-Dimensional: Sync across devices (the faster, the better).
- Attractive: AI suggestions for organizing your notes.
- Indifferent: A feature to change the background color of the notes.
- Undesirable: Mandatory sign-in just to view notes (...who hurt you?)
2.2. Actual how-to
Step 1: Creating a List of Features for Research (Up to 5 at a Time)
- Identify which characteristics and product functions you want to analyze.
- Don’t overwhelm users with too many features at once.
Step 2: Formulating Positive and Negative Questions for Each Feature
For each feature, ask two questions with 5 answer options:
YES:
How would you feel if this feature IS in the product?
- I really like it.
- I expect to see this feature.
- I don’t care.
- I don’t like this feature, but I can tolerate it.
- I strongly dislike that this feature is in the product.
NO:
How would you feel if this feature is NOT in the product?
- I really like it.
- I expect this feature to be missing.
- I don’t care.
- I don’t like that this feature is missing, but I can tolerate it.
- I strongly dislike that this feature is missing.
The answers determine the type of feature according to the KANO model:
- Attractive
- One-dimensional
- Must-have
- Indifferent
- Undesirable
❗ It’s Very Important to Ask Questions Correctly ❗
Ensure both positive and negative questions are about the same feature.
- For example, in the screenshot ahead, the questions were asked incorrectly.
- They were perceived as different features, resulting in inaccurate data.
- The same people could vote that they like the feature being present and also like it when it’s absent.
- Such surveys need to be restarted with properly aligned questions.
Step 3: Create the Survey
Draft a clear and focused questionnaire for your users.
Step 4: Prepare an Introductory Message
Write an accompanying letter or message to explain the purpose of the survey.
A few examples: |
---|
Subject: We Need Your Input – Quick Survey on [Project/Feature] Hi Team, We're currently working on improving [Project/Feature/Product], and your feedback is essential to help us move in the right direction. Please take a few minutes to complete this short survey: 👉 [Take the Survey] Your responses will help us make more informed decisions moving forward. Thank you for your time! Best, [Your Name] [Your Position] |
Subject: Quick Survey – We Value Your Feedback Hello Team, To ensure we’re aligned on [Project/Feature/Product], we’d appreciate your feedback. Please take a few minutes to fill out this brief survey: 👉 [Take the Survey] Your input will help us improve our workflow and deliver better results. Thanks in advance! [Your Name] |
Subject: Help Us Improve [Project/Feature] – Quick Survey Hi Everyone, We’re gathering feedback to make [Project/Feature/Product] more effective for the team. Your input will be incredibly valuable in shaping our next steps. Please share your thoughts here: 👉 [Take the Survey] Let’s make this project even better together! Thanks for your help, [Your Name] |
Subject: Your Feedback Matters – Internal Survey Hi Team, As we continue to refine [Project/Feature], we’re collecting data to guide our decisions. Please take a moment to complete this survey and help us make informed improvements: 👉 [Take the Survey] Every response counts. Thank you for contributing to our success! Best, [Your Name] |
Subject: We’d Love Your Thoughts on [Project/Feature] Hey Team, We’re making some updates to [Project/Feature/Product], and we’d really appreciate your honest feedback. Take 2-3 minutes to fill out this short survey: 👉 [Take the Survey] Your input will help us make smarter decisions moving forward. Thanks a lot! [Your Name] |
Step 5: Send the Survey to Diverse User Segments
Distribute the survey among users from different target segments to get varied feedback-
Step 6: Just Counting Responses Isn’t Enough
You need to define whether a feature is:
- Mandatory (Must-have)
- One-dimensional (Performance-based)
- Nice to have (Attractive)
Simply counting votes won’t provide this depth of insight.
Step 7: Analyze the Results
- Enter responses into a table, categorizing features as Basic, Competitive, Attractive, Neutral, or Undesirable.
- By cross-referencing positive and negative answers, you can determine the type of each feature.
Example Table for Analysis:
Positive Question → | Like | Expect | Neutral | Can Tolerate | Don’t Like |
---|---|---|---|---|---|
Like | – | Attractive | Attractive | Attractive | One-dimensional |
Expect | Undesirable | Neutral | Neutral | Neutral | Must-have |
Neutral | Undesirable | Neutral | Neutral | Neutral | Must-have |
Can Tolerate | Undesirable | Neutral | Neutral | Neutral | Must-have |
Don’t Like | Undesirable | Undesirable | Undesirable | Undesirable | – |
Step 8. Counting the Number of Responses
Goal: Ensure that the number of responses is sufficient for statistically significant results (since the Kano model relies on quantitative data).
There are several ways to determine the type of feature based on responses:
BASED ON THE NUMBER OF RESPONSES (Discrete Analysis)
- If analyzing results this way, count how users’ responses are distributed for each feature.
BASED ON RESPONSE DISTRIBUTION (Continuous Analysis)
- This method is more complex and will be explained in a separate post.
Step 9. Prioritizing Features According to a Successful Product Ratio
- 50% Mandatory Features (Must-have)
- 30% One-dimensional Features (Performance-based)
- 20% Attractive Features (Delighters)
This balance ensures the product meets essential needs while offering desirable features.
Step 10. Identifying User Types Based on Responses
Determine how respondents react to product features:
- Those who classify features as Mandatory or One-dimensional → Early Adopters / Early Majority
- Those who classify features as Attractive → Late Majority
- Those who classify features as Indifferent or Undesirable → Non-adopters
3. Sketch → Wireframe → Design
Step 1. Sketch it out (yes, on paper)
TLDR: Throw ideas on paper.
Let’s be honest: your first idea is probably trash. And that’s fine. That’s why we sketch. Grab a pen, a napkin, or the back of some meeting notes and just start drawing. It doesn’t have to be pretty—no one’s handing out awards for best stick figure. The goal here is to throw ideas out, even the dumb ones, and see what sticks.
Sketch multiple versions. Seriously, don’t fall in love with your first attempt. Play around. Move buttons. Shift layouts. If users can’t figure out how to get from A to B without wanting to flip their desk, start over.
And please, show it to someone. If they look at it and go, "Uh… what is this?"—congrats! You just saved yourself from building a feature no one understands.
Step 2. Build Wireframes (Fancy Word for Black & White Boxes)
TLDR: Create a layout that makes sense, but don’t worry about colors yet.
Okay, now that you’ve got some half-decent ideas, it’s time to make them less embarrassing. Open Figma and start putting those messy sketches into something more structured.
But don’t get fancy yet. No colors. No gradients. No trendy glassmorphism. Just plain, boring layouts. Wireframes are about figuring out how things work, not how they look.
Ask yourself:
- Can users find what they need without a treasure map?
- Is the flow logical, or do they need to solve riddles to proceed?
Walk through it as if you’ve never seen it before. If you’re confused, imagine how bad it’ll be for users.
Step 3. Make It Pretty (But Functional)
TLDR: Add visuals but don’t forget usability.
Finally, you can make it look nice. But don’t go slapping colors everywhere like a toddler with crayons. Every design choice should make the product easier and better to use.
Pick a color palette that doesn’t burn eyes. Choose fonts people can actually read (no Comic Sans, please). Add icons, images, and maybe a little animation—but only if it makes sense.
Here’s the rule: if it doesn’t help the user, it’s useless.
Design isn’t about showing off how artsy you are. It’s about solving problems and making things work. Cool shadows and fancy buttons won’t save a confusing interface.
4. Let People Roast Your Work
...can Grandma use it? No? Start over
TLDR: Find what’s broken before users do.
Here’s the hard truth: you are too close to your own design. What makes perfect sense to you might be a total mystery to someone else. That’s why it’s crucial to show your work early and often. Don’t wait until the last minute to get feedback—by then, it’s too late to make real changes. Share those rough drafts, awkward layouts, and half-baked ideas. The sooner you hear “this doesn’t make sense,” the sooner you can fix it.
But don’t just ask your designer buddy for feedback—they’ll focus on colors and fonts. Show it to someone who’s never seen it before. Watch how they interact with it without explaining anything. If they’re clicking the wrong buttons or getting lost, that’s on you, not them.
Remember: users won’t read instructions, and they definitely won’t call support. They’ll just leave.
Also, don’t forget about accessibility. If your design only works for people with perfect vision and laser-precise mouse clicks, you’ve already failed a huge portion of your audience. Test with screen readers, check contrast, and make sure Grandma could use it without rage-quitting.
Bottom line? Let people break your design now so users don’t break it later. Feedback might sting, but broken products hurt worse.
4.1 How to Run a Demo (and Actually Get Useful Feedback)
TLDR: Present your design in a way that invites honest, helpful feedback.
- Know your audience: Tailor the demo to your audience. Developers want different details than stakeholders.
- Keep it focused: Don’t show everything. Walk through key flows and features that need feedback.
- Explain the "Why": Don’t just show what you made—explain why you made it. Context matters.
-
Ask specific questions:
- "Does this flow make sense?"
- "Is anything confusing or missing?"
- "What’s the most/least useful part?"
- Encourage honesty: Make it clear that you want constructive criticism, not polite nods.
- Take notes, not offense: Write everything down. Don’t argue—just listen.
- Summarize next steps: End the demo by confirming what changes you'll explore based on feedback.
⚡ Pro Tip: If no one has any feedback, ask, “If you had to change one thing, what would it be?” That always works.
4.2. Running a Usability Study Without Making It Awkward
TLDR: Watch how real users interact with your product and find where they get stuck.
- Define what you’re testing: Be clear on which flows or features need testing. Don’t try to test everything at once.
- Recruit the right users: Find participants who match your actual user base. Testing with your team doesn’t count.
-
Give them tasks, not instructions:
- Bad: “Click the blue button to log in.”
- Good: “Show me how you would log in.”
- Shut up and observe: Let users struggle. Don’t jump in to help—they won’t have you holding their hand after launch.
- Record reactions: Use screen recording (with permission) or take notes. Pay attention to pauses, confusion, and frustration.
-
Ask open-ended questions:
- "What did you expect to happen here?"
- "Was anything unclear?"
- "How would you describe this process to a friend?"
- Look for patterns: One user getting confused might be a fluke. Three users getting stuck? That’s a design problem.
- Test accessibility: Don’t forget users with disabilities. Use tools like screen readers or color contrast checkers.
- Thank participants: Always thank users for their time. Maybe bribe them with coffee.
- Fix what matters first: Tackle the critical usability issues before polishing small details.
⚡ Pro Tip: If users say "It’s fine," that usually means it’s not fine—they just don’t want to hurt your feelings.
Here is the sheet structure I used:
- Tasks participants complete. Recorded in Column A.
- The click path, or sequence of actions, a participant follows for each task. Recorded in Column B.
- Observations about participant behaviors, feelings, and pain points as they interact with the product. Recorded in Column C.
- Direct quotes from participants that highlight parts of their experience. Recorded in Column D.
- How easy or difficult it was for the participant to complete each task. Recorded in Column E.
Links and sources:
Design Tools & Resources
1. Dribbble – Inspiration for Design
A platform full of creative designs and UI concepts. Great for exploring trends and getting visual inspiration.
2. Coolors – Color Palette Generator
Quickly generate beautiful color palettes for your projects. Perfect for avoiding those awkward color combos.
3. Colors Visualizer – Palette Testing Tool
Visualize how different colors look together. Useful for checking color harmony before committing to a design.
4. Color Contrast Checker – Accessibility Testing
Ensure your text and background colors meet accessibility standards (WCAG). No more "gray text on gray backgrounds."
5. Material UI Icons – Free Icon Library
Ready-to-use, clean, and scalable icons for your designs. Great for consistency in UI components.
Learning
1. Google UX Design Course (Coursera) – Learn UX Fundamentals
Comprehensive UX course covering user research, wireframing, prototyping, and usability testing. Ideal for beginners and pros.
2. Refactoring UI – Practical UI Tips for Developers
A hands-on guide with actionable advice on how to improve UI design without needing to be a "designer."
3. The Non-Designer’s Design Book by Robin Williams – Design Basics Made Simple
A beginner-friendly book covering core design principles like contrast, alignment, repetition, and proximity.
Congrats, you’ve officially leveled up. The basics are behind you, but the real challenge begins now. Tools are just tools — what matters is how you use them. If your work makes someone’s day easier, you’ve done your job.
...now go make something. And maybe check your contrast ratio.
<3
Top comments (0)