for those of you who want to build a great product this video is made for you I will
break down my ux design workflow I break down this entire workflow to three parts
so that it's easy to understand the first stage is pre-figma stage the second stage is
heavy figma stage and the third stage is light figma stage and let's start from the beginning
pre-figma stage is everything you need to do for preparation before jumping to the figma
file and then design the screens and this stage include syncing with PMS Engineers
or if you are in a startup the founders of the startup do user interview create Persona map out
the current user journey and then design a user Journey for your product and internal iterations
engineering and product sync can happen anywhere at this stage the main idea is to get product
constraint and Engineering constraints early on so you don't design for solutions that will never be
able to implement at your company user interview pretty much just means understand the problem and
understand the user before jumping into creating a solution for them most companies are solving a
problem that doesn't even exist so defining the right problem at this stage and making sure that
problem actually exists is super important for anyone in your company to do a good job and I
think that's usually the founders responsibility in the PM's responsibility so make sure you
collaborate with them and if you think there's things that's not working tell them your feedback
Persona well there's so many examples of persona all you need to do is to create a character that
represents your target user and then you can reference to that persona's name through all
the design process the next one I feel like a lot of companies skipping the step which is mapping
out the current user Journey you can simply go on google doc or notion just type down every single
step the user has to do to solve the problem today you can use arrows to connect each step and you
can explain each step further in detail after you map up the current user Journey you need to
propose the after user journey and that one is the user Journey for your product the idea is
that you need to create a user experience that's better than what the user already have today
many designers jump directly to designing the screens without thinking through how do I build
a good ux framework and unfortunately no UI can compensate for a bad ux let me give you a concrete
example let's say one day I decide to become a ux design tutor if one day I have too many students
coming in I will want to design a product that's digital at this stage I hire some ux designers
and Engineers to build me a website that can just simplify all the process bring the service online
it's extremely important for you to map out the existing user journey in the beginning there's
a stage where I have this one-on-one conversation with this student that I share my story she shares
her story and this stage builds trust if we skip the user Journey step you might see a designer
bring me a flow that looks like a website landing page that directly want to sell you this course
it may not build the amount of trust that I was building before and it may not be the amount of
human connection I was building before to design a product the user will actually adapt to you have
to think through what's happening before and at least design something that is as good as what's
happening before so maybe after mapping out the user Journey you'll realize it's much better to
bring a video of me talking about the product so the user sees my face knows who I am and
understand my story and then later on ask the user to tell their story in a creative way and
finally for pre-figma stage you need to go through internal iteration I will just make this user
Journey brainstorming session a team collaboration session I would invite Engineers I will invite PMS
I would invite the founder for this startup if it's a startup and that helps everyone to get an
idea of what we're going to build that can also help with directly understand the constraints
from the product and Engineering side so we just solve that problem in the meeting now going to
heavy figma stage this stage include UX designer designing all the screens designing everything
the biggest mistake you can make at this stage is jumping right into designing a high fidelity
prototype so ideally you shall go from wireframe or low fidelity the prototype to user testing to
mid-fidelity prototype to another user testing then to a high fidelity prototype your wireframe
shop represents your proposed user journey in the previous step but there's no need to worry about
color font sizes font spacings just put a text in without any auto layout and then just use gray
color don't try to make this pretty and ideally you should be bringing this wireframe to some
users to test out whether the structure makes sense however I understand that many companies
will tell you we don't have the resources to bring user testing this early then I would suggest you
find people inside your company that actually use your product and then test this on them I don't
suggest to iterate on your design only based on what your boss say to you or only based on what
the leadership tells you they will bring more feedback from a product oriented and business
oriented point of view which might not lead to best design as for your user you want to balance
after this user testing then we can go to mid-fi prototype and how many details to add into this
mid-fi prototype is really based on your decision so after mid-fi prototype we shall bring this to
another round of user testing basically we have to have at least one round of user testing before
we bring the product to the engineers and usually the early we bring in user testing the more money
we're going to save let's say if you've never done any user testing before mid-fi prototype
and if at this stage your user tells you that the structure just doesn't make sense then you will
have to go all the way back to the low fidelity prototype and then change all the structure there
so finally after this user testing you shall go to High fidelity prototype or you can do
more iterations based on the timeline of your company this one should be in sync with your
current design system all the spacings all the details shall be spot on and align with the other
designs in your company finally it is the light figma stage the light figma stage is what happens
after you ship Your Design just because shipping your design doesn't means your design stops here
because the engineers can bring you a thousand request after you ship Your Design it's just a
simple fact that front-end engineering doesn't work the same way as designing on figma thinking
through the user point of view doesn't mean we can think through all the scenarios a code can return
one example if you are designing for a responsive website then you have to work with a front-end
engineer to make sure that the responsive actually looks good to you you might need to adjust your
design a little bit just for the front-end code to work and for back-end scenarios there could
be error cases that you forgot to design for every single interaction point in your design
could return an error in the back end and you need to think about maybe a pop-up window that
communicate what is the error and how to fix it for the user that's something I forgot to design
last time there could be also other things like the legal coming to you and say that oh you have
to change this line of text* because this just won't work in the EU yeah Europe has a lot of laws
regarding how your product needs to communicate itself so you might need to adjust your product
because of the legal reason in the light figma stage might not be super light on figma after all
so I really think it's much more healthier to think of all these three stages equally
instead of only focusing on the heavy figma stage I hope if you are trying to build a great product
this video is insightful to you and if you want to see any other thing from my channel just drop me
a comment don't forget to subscribe to my channel thank you so much I'm Aliena and see you next time