Designing Juni's products & building the Design team
At Juni I was hired (as the 12th employee) to build up a high performing product design team. I cam in shortly after the core team around the founders have raised seed funding and there there was no product but only a company vision and prototype and a waiting list of early customers showing interest. I cam in on the misison to create a team that takes cusotmers insights into account and build great featutres. Through the next 3,5 years I have been doing the following:
Juni.co
Juni funding (1) (2) (3)
Overview
Overseeing the design of x new products on the platform
Maintaining a continuously updated product visio
Building a design system
Setting up the design team environment adn discipline in the company (incl. UX Research)
Hire, manage and develop for Product Team
My 5 key takeaways on the journey
From vision to beta product launch
First 6 months - working as an Individual contributor (IC) and one junior designer
We had a vision and a prototype why people signed up. But we needed to spread out the work and prioritise what was needed first.
We also did marketing material for ads, email signatures and everything that needed some more attention to visual detials.
Vision concept
Those designs have been used to generate the first attention and creating a waiting list campaign. This was done in by the founding team before I came in to set up the Design team.
Learning from customers
Initially me and the other Designer had calls with everyone on the waiting list to see what they biggest pain points are are understand better why they signed up an what their expectations were. This helped us better prioritize the nice to have features among the must haves that were so clear and fundamental to be build.
Beta product
This was the first design where we translated base functionality from the vision into a functional beta product. Adt first with a much limited feature set, but with a more consistent and scalable design langage.
Outcome / Impact
One of the first things we build was a transactions page and the onboarding flow to be able to bring customers on board easily. We also defined what the first value there should be for customers once onboarded, which was virtual cards. Card exchange was one of the first revenue streams and it was clear that we should make it easy for customers to sign up and access cards.
Coming out of beta - rebranded
First 6 months - working as an Individual contributor (IC) and one junior designer
After 1 year of beta phase, the product was refined and ready for a rebranding. In this collaborative project between Design and Marketing, we worked closely with Verve on a new look and feel of the brand, which needed to be reflected in the product as well
New identity
We worked on a new brand statements based on the overall company vision. This included a new tone of voice but also visual elemnents such as a new logo and color palette
Illustrations
Together with a freelancer we explored various illustrations styles, that were based on the initial idea of the pressure lines produced by verve into a set of product illustrations replacing the previous usecases
Product rebranding
As a result we applied the updated color palette and illustratins back into the product such as the login screen, empty states, sidebar etc.
Outcome / Impact
xxx
Overseeing the design of x new products on the platform
First 6 months - working as an Individual contributor (IC) and one junior designer
After coming out of beta, we have learned about many issues that customers had with there daily finance operations. This builded a backlog for the product roadmap, which has been build yearly and reviewed and adjusted on a quartely basis. Initially the development has been very fast with some design debt accruing, but we started to (adopt) developed a more cohesive process during the product design and development cycles.
Approach
Over times we gained a more deep and wide understanding of the needs around our products and started connecting them in a uniform way using an improved information architecture and building or reusing design patterns. Documenting what we had in a first Design System helped speed up development processes whiles maintaining consistency. Also continious vision prototypes allowed us to explore beyond pure feature requests and evaluate opportunities well connectecd to our long term vision.
Outcome
As a result we devoloped x new features to diversivy our revenue streams and increase the overall user experience. Here is a selection of the most important ones
Maintaining a continuously updated product vision
First 6 months - working as an Individual contributor (IC) and one junior designer
In order to explore new opportunities we developed an annual vision. With each iteration we learned to collaborate better across product and leadership to align expecations and find the best scope for a vision
Approach
Trying out a few different approaches, the last approach we used was to: interviews, CS feedback, Vision, User yourneys
Journey mapping
User journeys helped all involved stakeholders to step back from their responible features or business areas and understand their contributions as a part of an overalll user journey. Mapping out the key areas that are part of the strategy worked as the overall guarding rails
Vision prototyping
The outcome was a vision prototype that illustrated possible solutions to key scearios that were laid out in the vision. (this should be a video). In this case we wanted to highlight a task centric user interfaces that helps user to navigate and resolve the most important finance issues without going through the individual features and parts of the platform
Building a design system
First 6 months - working as an Individual contributor (IC) and one junior designer
With a rebranding happening with out of beta, we wanted to have this reflected in the Product as well and used this opportunity to unify our designs a bit more
Approach
Base our DS on a consolidated 3rd party systems as a basis. Translating the rebrand into components and layouts taking accesibility into accounts. Create our own librarys and connect them to the Frontend team through storybook.
Setting up libraries and processes
Figma library, storybook, first process laid out how to work with DS and contribute to it if it does not cover all cases of the designers, leaving still a lot of autonomy to the team. Dedicating 50%-100% of a Deisgner and FE to set up and maintain the system. We also included a first evaluation round, to track the progress and adoption of the DS ( tile with animating components and a pattern with breakpoints etc.)
Setting up the design team and environment
First 6 months - working as an Individual contributor (IC) and one junior designer
Immediately after joining Juni and approaching Series A round (more infos here), we were in the midst of preparing for scaling the operations. We started to seek first support through freelancers and then opening permanent positions for the team, which required rough role descriptions, onboarding material, and scope of work, and a career outlook.
Establish a user centric workflow
Set up tools that support that
Advocate for Design
We first looked at what the company was based on and what our immediate needs were. We knew, that requriements will change down the line and did not want to implements a very complicated processes that are more taileored fro mature companies, and that we may need to change down the line. We sticked to Notion, Google Suite, and brought Figma and Dovetail to the company.
Starting and scaling a design team
We first looked into freelance then opened positions. We looked at the product teams which were formed around the same time and evaluated how much design work would be needed in each.
The first month we were building bas functionality that were table stakes. Later we entered teretory where we build unique solutions. But we needed to know more about the customer problems and what they woudl make them switch over to Juni.
Competitor Reviews
Connecting to customer success and slaes for feedback on the product
In depth studies on opportunity areas with little knowledge
Setting up design operations and tools
Dovetail, Loom video guides, Notion pages, Insigh reports
Outcome
After being 2 designers being responsible for everything, we split upa the work gradually by each designer serving 2 product teams to 1 designer per product team. This process resulted hiring 10 individuals across Product Design, UX Research and UX Writing over the course of 1,5 years.
Monthly reports, 2 full time resources working across product teams. Research operations to enable Deisgners and Product Managers to carry out studies in a uniform way that could be shared company wide.
Working with Figma was essential in our remote first company. Implementing Dovetail as a research repository helped us documenting our user interviews for exploratory insights and early qualitative testing sessions, before we later included more sophisiticated tools such as PingPong, Maze, Hotjar etc.