Do not be afraid of taking your design from UX to UI
4 Tips for UX Designers with Zero Graphic Design Background
For the past one and a half years, I’ve worked as a UX/UI Designer, and in that time, I have worked on a variety of projects. These included redesigning an investment app and my company’s website, also creating a UX wireframe kit from scratch.
And, I have no background in graphic design at all.
How was I capable of doing all of those design projects? I’m not going to lie; it was very challenging. Specifically, I did not know how to set up logical UX wireframes that reflected useful insights we obtained from user research, and then take them rapidly into finessed UI design.
However, I thought the struggle was worth it in the end, and I would love to share what I did to overcome it. Here are my top 4 tips for UX/UI design beginners and how to progress your designs from logical UX wireframes to UI designs.
1. Start with purpose and research insights
While you build your UX wireframes and feel stuck in your design, there are a few questions you can ask yourself:
What are the objectives/purpose of these components/layout you are designing now?
How does it solve your users’ problem? – or even, DOES IT?
Does your design reflect what you’ve learned from your research? If so, add annotations as you design, including your logic as to why you think these design elements are necessary and relevant research findings. If not, you can revisit the idea
These series of exercises will help you remarkably when explaining your design decision to clients or your team, BUT mostly for you to better understand your design.
2. Trust your gut feeling
This tip can apply more generally.
Having spent my first project being mostly introverted and passive because I was nervous to avoid making mistakes, I had my first performance review with my boss and a senior designer where I asked them about what would help me to step up and grow in a team.
They showed me a lot of support and gave me great tips on how to improve my confidence, but there is one piece of advice that I remind myself of constantly.
“Trust your gut feeling – if things don’t seem right, they probably aren’t, so speak up, so we have a chance to question ourselves and create better solutions”.
This advice particularly helps me when I feel that something on my UX wireframes doesn’t make sense. I then bring the issue up to my team and discuss my concerns with them. I found that this is the best way to avoid going around in circles with your design.
Image: blueegg Designer Nura Lim working on a project. - CAN’T RETRIEVE
3. Ask for rapid feedback – learn, build, measure and repeat
One thing you shouldn’t be worried about during design phases of UX/UI projects is trying to impress your team right away. So, be confident enough to ask for feedback even if it’s only rough wireframes.
By doing so, you can:
-
Build rapport with your team members
-
Learn & grow faster
-
Save everyone's time
-
Show your work ethic & enthusiasm
-
Raise an opportunity to ideate the best design solution within the team
If you start questioning your design, trust your gut feeling, ask for rapid feedback, learn something, build again, ask for feedback, and repeat.
4. Design references: imitating vs. getting inspiration
After the UX wireframes get approved, the next step is UI design. These often include aligning with brand guidelines or creating a brand design system which contains colour palette, typography, iconography, and basic components such as buttons styles. Then you apply the “design rule” to your wireframe to maximise engagement with users.
However, it can all sound overwhelming, especially if you don’t have any graphic design background like me.
First of all, don’t feel pressure to create something creative that will blow people’s mind, but try the steps below while being mindful of keeping the balance between imitating vs. getting inspiration.
A. If available, view brand and style guide or determine your own brand/style guide using:
-
Colour palette
-
Typography
-
Accessibility
-
Iconography
-
Basic components such as button style
B. Visit design inspiration sites such as:
-
Dribble (https://dribbble.com/)
-
Behance (https://www.behance.net/)
-
Muzli (https://muz.li/)
-
Google search
C. Use keywords to search for specific design patterns – E.g. ‘dashboard’, ‘dashboard UI’ or ‘dashboard app designs’.
D. Find design elements that are suitable for your design solution and review these alongside your UX wireframes to determine suitability.
E. Modify it to align with your brand design system.
Congratulations, you have designed something 🙂
Take away
Four tips for UX/UI design beginners with no graphic design background and how to progress from UX to UI design:
-
Start with purpose and research insights
-
Trust your gut feeling
-
Ask for rapid feedback – Learn, build, measure and repeat
-
Get UI inspiration from design references sites
I believe those will be a good starting point when progressing from UX to UI. Remember, we all start from somewhere, and the key is asking questions and grow from there. Best of luck!
4 Tips for UX Designers with Zero Graphic Design Background
For the past one and a half years, I’ve worked as a UX/UI Designer, and in that time, I have worked on a variety of projects. These included redesigning an investment app and my company’s website, also creating a UX wireframe kit from scratch.
And, I have no background in graphic design at all.
How was I capable of doing all of those design projects? I’m not going to lie; it was very challenging. Specifically, I did not know how to set up logical UX wireframes that reflected useful insights we obtained from user research, and then take them rapidly into finessed UI design.
However, I thought the struggle was worth it in the end, and I would love to share what I did to overcome it. Here are my top 4 tips for UX/UI design beginners and how to progress your designs from logical UX wireframes to UI designs.
1. Start with purpose and research insights
While you build your UX wireframes and feel stuck in your design, there are a few questions you can ask yourself:
What are the objectives/purpose of these components/layout you are designing now?
How does it solve your users’ problem? – or even, DOES IT?
Does your design reflect what you’ve learned from your research? If so, add annotations as you design, including your logic as to why you think these design elements are necessary and relevant research findings. If not, you can revisit the idea
These series of exercises will help you remarkably when explaining your design decision to clients or your team, BUT mostly for you to better understand your design.
2. Trust your gut feeling
This tip can apply more generally.
Having spent my first project being mostly introverted and passive because I was nervous to avoid making mistakes, I had my first performance review with my boss and a senior designer where I asked them about what would help me to step up and grow in a team.
They showed me a lot of support and gave me great tips on how to improve my confidence, but there is one piece of advice that I remind myself of constantly.
“Trust your gut feeling – if things don’t seem right, they probably aren’t, so speak up, so we have a chance to question ourselves and create better solutions”.
This advice particularly helps me when I feel that something on my UX wireframes doesn’t make sense. I then bring the issue up to my team and discuss my concerns with them. I found that this is the best way to avoid going around in circles with your design.
Image: blueegg Designer Nura Lim working on a project. - CAN’T RETRIEVE
3. Ask for rapid feedback – learn, build, measure and repeat
One thing you shouldn’t be worried about during design phases of UX/UI projects is trying to impress your team right away. So, be confident enough to ask for feedback even if it’s only rough wireframes.
By doing so, you can:
-
Build rapport with your team members
-
Learn & grow faster
-
Save everyone's time
-
Show your work ethic & enthusiasm
-
Raise an opportunity to ideate the best design solution within the team
If you start questioning your design, trust your gut feeling, ask for rapid feedback, learn something, build again, ask for feedback, and repeat.
4. Design references: imitating vs. getting inspiration
After the UX wireframes get approved, the next step is UI design. These often include aligning with brand guidelines or creating a brand design system which contains colour palette, typography, iconography, and basic components such as buttons styles. Then you apply the “design rule” to your wireframe to maximise engagement with users.
However, it can all sound overwhelming, especially if you don’t have any graphic design background like me.
First of all, don’t feel pressure to create something creative that will blow people’s mind, but try the steps below while being mindful of keeping the balance between imitating vs. getting inspiration.
A. If available, view brand and style guide or determine your own brand/style guide using:
-
Colour palette
-
Typography
-
Accessibility
-
Iconography
-
Basic components such as button style
B. Visit design inspiration sites such as:
-
Dribble (https://dribbble.com/)
-
Behance (https://www.behance.net/)
-
Muzli (https://muz.li/)
-
Google search
C. Use keywords to search for specific design patterns – E.g. ‘dashboard’, ‘dashboard UI’ or ‘dashboard app designs’.
D. Find design elements that are suitable for your design solution and review these alongside your UX wireframes to determine suitability.
E. Modify it to align with your brand design system.
Congratulations, you have designed something 🙂
Take away
Four tips for UX/UI design beginners with no graphic design background and how to progress from UX to UI design:
-
Start with purpose and research insights
-
Trust your gut feeling
-
Ask for rapid feedback – Learn, build, measure and repeat
-
Get UI inspiration from design references sites
I believe those will be a good starting point when progressing from UX to UI. Remember, we all start from somewhere, and the key is asking questions and grow from there. Best of luck!