Transitioning from Web Design to Product Design: What have I learnt?
For a long time, I was comfortable and settled as a Creative Web Designer in my career. This wasn’t an accident. I worked hard. It took many hard years of learning how to code from the ground up, having graduated as a Graphic Designer that was primarily taught print techniques.
It wasn’t until I started working more closely with the Product Design team at Vend (I was previously a Senior Web Designer in the same organization), that my complacency became unjustified. I discovered a great passion for user centered design and the opportunity to grow further as a designer. My curiosity for the UX design paradigm grew fonder every time I came across articles about the commonly known UX best practices, and witnessed how our Product Designers at Vend were practising them.
So a year ago I left my comfort zone and stepped into the Product Design role. It was a great challenge switching my career path from doing something that I was fluent in to something that I wasn’t. During this period of transition, I’ve often been asked: “How do you find Creative Web Design different as compared to Product Design?”
Here is what I’ve learnt.
1. The design mindset
We know that all designers should understand what they are designing for and why it is meaningful to the target audience. Apart from making information accessible, the core mindset in Web Design was about curating brand story and building relationships. We designed to create and develop an emotional connection between people and the brand in mind. Among these include articulating the benefits and values of using Vend to resonate with retailers’ desire to become better, so that they can make confident decision in the buying process.
As for Product Design, the design mindset is primarily on problem solving and facilitating users to do what they have been trying to get done. A Product Designer doesn’t necessarily have to wear the branding design hat but being curious and empathetic are indispensable. This is when the UX design practices comes in handy to develop usable and useful solutions.
If Web Designers bring people to a product, then a Product Designer would design to keep people using it.
2. Visual Design
In Web Design, I remember spending the better part of time creating mood boards and exploring visual concepts. This is important because unique and conceptual visuals are salient to connecting people with our brand. It is also the first impression that decides whether or not one should stay to learn about the product or service. Apart from cultivating for individuality, the visual narrative can also directly reflect the credibility perception of a brand. Often in Web Design, there are no creative limitations that we have to compromise with. They can be abstract, experimental and sometimes illogical — as long as they can speak for the brand.
Unlike websites, visuals can hardly be experimental in products. In fact the visual semiotics has to be clear and self-explanatory, so users know what to do confidently without a second thought. Instead of communicating for emotion and individuality, visuals are often used to make the process of consuming complex information easier and delightful. For instance, illustrations mimicking real life devices are used in our payment setup process to reduce the cognitive load of pairing a payment terminal to Vend.
While the bottom line for creating meaningful visuals in product is to be clear, it is also necessary to incorporate some sense of humour at times. For instance, we turn our error pages into a delightful one with amusing visuals.
3. Copywriting
With User Experience becoming the key differentiating factor to successful products, the increased need for UX copywriter became apparent. I was first puzzled with this phenomenon, which then took me months to understand the need for this role to diverge from a copywriter. The biggest difference varies in the tone, determined by the type of information that a user need to know in different situations.
When a user visits our website, they are at a touchpoint of learning and researching for the best point of sale that aligns to their business needs. With regards to communication as the focus in Web Design, a copywriter’s focus is to inform, educate, and sell how Vend can help to improve their retail lives. Often the tone is invitational, and expressive words are used to captivate and sell how Vend can improve retailers’ existing retail situations. Take our Vend homepage for example, the subtitle says:
“Effortlessly sell, manage, report and grow your retail business in every way with Vend’s unmatched POS, multi-outlet retail and inventory management system.”
Users at this point do not need to know explicitly all the steps to sell with Vend yet but not the key benefits on why retailers should use Vend. In contrary, once they have opted in to use the product, they just want to get their job done fast. Hence using expressive words won’t help users to complete the tasks that they need to do. Indeed clear, concise and direct UX copy are useful because no one has time to guess and question “How do I… ?”. The tone of voice is rather conversational, sometimes instructional.
Taken even further, we avoid using jargony and complicated words in product. Imagine replacing “Search for product” with “Search for inventory” on the search product input, would a cashier understand faster? One method that I always use to ensure for good human-oriented copy is to imagine explaining it to a friendly neighbour!
4. UX Design Process
The most common buzzwords that we often hear in response to Product Design are none other than user centered design or empathetic design. They are collaborative and iterative design process that focuses on user needs. Our product design process is developed based on the popular method coined by IDEO called Design Thinking, which is built of the five design phases: Empathize users, define problems, ideate proper solution for that problem, build prototype and test the solution with real users.
Design thinking focuses on revealing the root problem at the early stage. That is why the early phases in the design thinking process focus heavily on problem discovery. If we can discover the root problems earlier, the probability of creating solutions that people need escalates. But if we fail to investigate enough on why things are the way they are, we might end up putting plenty of effort working on the wrong solution, which will not resonate to what users actually need.
While design thinking is highly practised in the Product Design environment, I do also see the commonalities in the Web Design process that I used to practice. Speaking of which, I did problem discovery, competitive analysis, mood boarding, wireframing, and etc. At the end of the day Web Designers still design for people. The only nuance here is to what extent does the UX practices come into play in the design process, which is highly affected by the requirement for business success.
For example when re-designing the Vend Resource Hub page, the business success was to increase our content download conversion rates. Challenged with time and resource constraints, I focussed only on Google Analytics to infer user needs and identify the pattern of high content acquisitions. I then replicated the positive pattern to use in the user flow redesign, which has succinctly led to a conversion rate of nearly double the previous baseline. Although the discovery method conducted wasn’t exhaustive, and that we might have missed out other valuable insights, it was still the appropriate one for business success.
5. Post-release focus
As mentioned, when the Vend Resource Hub page went live, we measured the impact it has on content download conversions, and its implication on trial conversions. This is because the ultimate focus for everything that we do in our marketing website is fundamental to increasing the trial conversions, which is the overarching business goal. Similar to when a new feature goes live in the product, we analyze the impacts too. But the focus is explicitly on the users, which we analyze if they are using the feature, if they can complete the tasks, if the feature solves their problems, etc.
There are times when we would make minor edits to a webpage like copy or CTA change if the results didn’t turn out as expected. However, the design won’t change extensively after a web page went live. In contrast to Product Design, where design can change at different dimensions depending on the test results from early stage of release (beta). As we want to keep people using our product over and over again, incremental improvements such as adding new valuable features later on is inevitable.
Final thoughts
Despite the various differences laid out between both landscapes, I see the core remains the same; we all design to solve problems. Regardless of Product Design, Web Design or even Interior Design for instance, they are the solutions that we design for human. People should be at the centre of all our designs, and we shall integrate their needs with the possibilities of technology to help create a better lived experience. Ultimately we want to create services, experiences and products that people love and keep using.
