Making the mistakes and attempt to correct them myself…

5 Mistakes Made in Product Design

I’ve recently shared about the learnings of a Product Designer in a start-up company. There are definitely more learnings from that 1 year. They always say that you learn faster by making mistakes and that is very true.

Here are 5 mistakes that I painfully made (and yes, I’m still in the process of correcting these mistakes)

1. Underestimating how much time a design need

At the beginning of the design phase, I often promised a timeline earlier than I should have. This adds up to a lot of stress and expectations later on.

What I didn’t factor in was the time needed to:

1. Familiarise with the context
2. Skills needed to work on it
3. Any hiccups along the way (eg. urgent task requests)
4. or maybe some days you are just not as productive as other days

Here’s what I learned to do:

1. Start tracking the time you need to work on something. Pomodoro timing is a good way to begin.
2. Build a system around the things you are working on. If it is repetitive, it can be turned into a system.
3. Break the task down into smaller tasks. Eg. Research (1 Hour), Ideation (1 Hour) etc.

That to say, this should be used on a case-by-case basis as some tasks have more urgent deadlines.

2. Forgetting the edge cases

What happens when there is an error in the process? Is there an error screen to it? What happens when there is no data showing up? We need an empty state. What will happen when the text-overflows?

You get my point…

Well, at the beginning of my career, I missed out on some of these screens.

These mistakes took me close to a year to fix and, yes, I am still fixing them now.

Guilty and perhaps the most critical problem

Here’s what I learned to do:

1. Think of scenarios and work on the user flow before designing
2. Create design patterns for common cases like error state, login flow, empty state, and many more. A good read will be Carbon design system by IBM.

3. Not organising and naming layers properly

My biggest pet peeve in design is not naming layers properly. However, I fell for my own pet peeve as projects started to increase in capacity. Juggling both designing and maintaining the design files is seriously taxing.

I admit I did not have trouble navigating the layers by clicking on the layers I want. I began to see a problem whenever I need to find a certain artboard from 100 over files. It became worse when I started rebuilding the component library as they are all named “Frame 19; Frame 203; Frame 1”.

Think of this mess as frames…

Here’s what I learned to do:

1. Make it a point to rename the top few frames.
2. Use components and rename them diligently if there is more than 1 of the same

4. Not indicating user flows

In a perfect design process, you will always be doing it by “Creating User Flow” > “Wireframing” > “Prototype” > “Handoff”. However, I did not follow this exact process and I drew my flow on a sketchbook instead.

There was never a real documentation of the flow nor a handoff procedure set up in a company. I will normally do it linearly from left to right to indicate the designs. However, that’s not really the case for all user flows and interactions.

I didn’t realise what was wrong until the engineers constantly approached me to ask what the next step is or where a button will lead to.

Very accurate representation of expectations vs reality

Here’s what I learned to do:

1. Create a template in Figma to work on a new PRD or Ticket request. Set a new page just for creating a user flow
2. Create a component library for all the UX flows. The lesser the effort required to create the flow, the easier is it to create.
3. Integrate the screens into the flow. It is easier to visualise it this way.

5. Not setting up a master file early

In an ideal world, there will always be someone maintaining the master file to ensure it reflects the deployed product.

Read the above sentence as a luxury because that’s not always the case in almost all companies.

What happens when you need a particular page for the flow? I find myself recreating them from the beginning (with no component library) or taking 5–10 mins to find the right page. That’s was me when I moved the design files from Sketch to Figma and did not have time to set up a new master file.

At the end of each project, I will also have a lot of different screens from different projects. This created another set of problems that hindered me from finding the latest source of truth.

Trying to find the right screen is a pain in the a**

Here’s what I learned to do:

1. Create a new Project called “Archive” and move all completed works into “Archive”
2. Spend 1 day in each month just to shift these projects back into your Master File.
3. Create templates for commonly used interactions and cards.

At the end of this writing, I begin to realise that a lot of issues can be solved by having a design system. It is definitely worth building one for your product if it is currently in the growing stage.

Here’s me signing off my second product design related article. If you would like to read more about my experience and journey, do follow me on Medium or drop me a PM over at my Instagram.

p/s: If you have a pleasant reading time, it is all thanks to my partner, Beatrice, for editing this piece of article!