The design industry has evolved quite a lot in the last few years, and today there are a number of different responsibilities encompassed by the umbrella term “Designer”. This kitchen brigade of roles has to be defined and orchestrated so that each one has the ingredients they need to cook their portion of the dish.

Thinking about this distinction in our industry, I recently tweeted this:

"The first problem in creating software is that most teams confuse UI/UX Design with Product Design. The two roles are distinct and not setting boundaries can lead to the failure of a project."

What I wanted to highlight is that a team without an entity with access to Business Knowledge will miss what we define as 'Contextual Knowledge'.

By the time you get to the end of this article, you will know what 'Contextual Knowledge' is, and what makes swissQuant products successful.

What is a product anyway?
Merriam Webster’s Dictionary provides two relevant definitions for 'product':

• Something (such as a service) that is marketed or sold as a commodity
• Something that is produced

While these are both accurate when it comes to physical products and commodity services, this is not how the interactive design industry has come to define it. A more accurate definition would be:

• A digital tool or experience that is updated continuously while still in use

This often refers to SaaS products that receive ongoing updates as the company adds features and adjusts to market forces and customer demands.

In his book, Elements of User Experience Design, Jesse James Garrett, founder of Adaptive Path, shows a great model for explaining product and user experience design.

I strongly suggest reading the concepts, but what I gathered from them is: that the first three levels are the task of a UI/UX Designer, while the last two are tasks for Product Designers. Let’s dive into some terminology.

What does UX mean?
UX applies to anything that can be experienced—be it a website, a coffee machine, or a visit to the supermarket. The “user experience” part refers to the interaction between the user and a product or service. User experience design, then, considers all the different elements that shape this experience.

The ultimate purpose of UX design is to create easy, efficient, relevant, and all-around pleasant experiences for the user.

What does UI mean?
It is the process that focuses on icons and buttons, typography, and colour schemes, spacing, imagery, and responsive design.

Like User Experience Design, User Interface Design is a multi-faceted and challenging role. It is responsible for the transference of a product’s development, research, content, and layout into an attractive, guiding and responsive experience for users.

What is the difference?
The main difference to bear in mind is this: UX design is all about the overall feel of the experience, while UI design is all about how the product’s interfaces look and function.

To summarise:

• UX design is all about identifying and solving user problems, UI design is all about creating intuitive, aesthetically-pleasing, interactive interfaces.
• UX design usually comes first in the product development process, followed by UI. The UX designer maps out the bare bones of the user journey, the UI designer then fills it in with visual and interactive elements.
• UX can apply to any kind of product, service, or experience, UI is specific to digital products and experiences.

What is missing?
The definition above is clear, but what about all those specific aspects of an industry that define the Business Domain? At swissQuant, we develop an ecosystem of applications for FinTech, so domain knowledge includes:

• Financial knowledge: expertise in banking processes, use of technical language, understanding of complex data visualisation.
• Target audience: establish who will use the product and what kind of knowledge these users have - Branch Manager, Relationship Manager, Bank Client, etc.
• Market gaps: what do the competitors offer, how they have solved their technical challenges and what has not been yet created?

Our internal structure has settled on the role that can bridge the gap between generic knowledge and specialized knowledge: the Product Designer.

Contextual Knowledge in FinTech
In short, a Product Designer creates solutions to the problems that might arise during both the design and development phases. They have direct connections to the sources that provide great knowledge of the industry the product is built for and can give answers to questions that block designers and developers.

In FinTech they will be able to investigate and then suggest how a product should:

• Adhere to regulations (in multiple Countries).
• Display metrics and aggregated information useful to the user.
• Display best-suited visualisations for large sets of data (candlesticks, histograms, spider charts, table fields).

In order to answer these questions, Product Designers will audit feedback from clients, connect to Product Owners and then assemble teams to facilitate solutions, create multiple test plans, produce wireframes and go through rounds of A/B testing. A Product Designer will also support the developers through the launch process, as well as working alongside the marketing teams to ensure synergy between the brand and the product.

From these skills we can derive our definition of 'Contextual Knowledge':

• Context most commonly refers to the environment or setting in which something exists.
• In software development, context is given by business logic, the implementation of algorithms that shape data into features or visually appealing elements.
• In design, context is given by the scope of the product, the set of answers that developers need to implement a feature.

Product Designers are, in short, the guardians of the product: ensuring it is the most relevant and functional product it can be and that all the stakeholders are onboard.

One of the best ways to distinguish between these two roles is to look at the questions they ask:

Simply put, a UX designer will identify the problems, and a Product Designer will find the solutions, which of course means that the latter have a higher range of responsibilities within the project.

Viputheshwar Sitaraman, who has worked as a design consultant for companies ranging from high-growth startups to Fortune 500 companies, believes that the roles have distinct responsibilities that need to be taken into account, and he says:

“The linchpin differentiator is that a UX Designer is solely focused on the user experience, whereas a Product Designer is concerned with overall business goals (including user experience).”

He continues:

“The core difference is their relationship with high-level business development goals and key performance indicators (KPIs). UX Designers’ primary/only KPI is user satisfaction with the customer experience. As such, much of a UX designer’s job focuses on optimising, improving, and innovating customer flows.”

Then, he further elaborates that the product designer is responsible for seeing the bigger picture of a product or project:

“Product Designers’ KPIs tie to the business as a whole: such as expanding into new markets, building organic growth engines, or increasing trial-to-conversion rates. As you can imagine, these kinds of decisions are far different from the experience design tasks typical of a UX role.”

Bridging concepts to Products
Product Designers are entities that understand business objectives and do the research to provide specialised knowledge and market analysis to their team. But how can this knowledge be integrated into the daily routines of a team?

At swissQuant we have taken a step further and transferred this know-how into a step-by-step process; it guarantees a consistent outline to make highly abstract financial concepts become Products and a Frontend Design Methodology that the whole company can follow.

The first step is for Product Designers to gather intel, they will:

• Empathise: conduct research to develop a deeper understanding of our clients.
• Define: combine the research and observe where problems exist. In pinpointing clients’ needs, they begin to highlight opportunities for innovation.
• Ideate: generate a range of potential solutions by giving themselves and their team total freedom.

Then, both Designers and Developers take part in the following:

• Workshop: introduce areas of the company to our unified Design System and Component Library Playground.
• User Journey: a brainstorming session to drive all kinds of designers through an interactive questionnaire that covers typical details: What problem do we solve? Why are we doing this? How are we doing this? What do we want to achieve? What data do we need and who provides it?
• Flow Chart Design: outline all paths of a user journey flow into diagrams, easy to change and maintain.
• Wireframe Design: a low fidelity mock representation of the Flow Chart, used to decide what visual elements, technologies and architecture fit our goal.
• Feature Design: we follow Feature Driven Design to reuse existing features and integrate new ones with modularity in mind.
• Handoff Mock Design: a high fidelity mock representation of the Flow Chart and Features that will be used as a 1-1 guideline by developers.

This process helps UI/UX Designers and Developers understand the user experience of a product as a whole; not purely as an interaction (feel) or visual (look) design part. Only after that, does it make sense to move to the actual implementation of a design solution which includes:

• Prototype: build a prototype (or series of prototypes) to test a solution. Creating a prototype lets designers see if they are on the right track, and often sparks different ideas that would not come in other cases.
• Test: return to our users for feedback, asking ‘Does this solution meet users’ needs?’
• Implement: put the vision into effect. Ensure that the solution is materialised and works for our users. This step is crucial for the entire process.

Conclusion
The secret sauce of out-of-ordinary design at swissQuant is a definition of both the roles and the path to follow.

Crafting complex financial products for our clients’ users is a recipe full of rare ingredients. We believe this methodology ensures we deliver the right platter of UIs that satisfies the need for simplicity and request for additional value of the end user.