Ecommerce upgrades for a porridge startup based in Munich, Germany. I redesigned their navigation, product pages, and a mix-and-match feature to increase conversion into checkout.
3Bears were using a template for their Shopify store. Looking to grow further, they wanted to maximise conversions and reduce drop-off from the product pages and checkout. I was tasked with creating custom designs using Figma, to be implemented by the development team into Shopify's 'Flex' theme.
Everyone hates shipping costs. I added a progress bar to make the shopping bag look unfinished until enough items are added for the order to receive free shipping.
People are more likely to buy when they’re already committed to a purchase. I added related items to the basket so that they can added with one click.
Research shows that the less actions a user has to take, the more likely they are to convert. With the new menu, users are able to find exactly what they are looking for without digging through multiple pages.
On the product page, we created a mix-and-match porridge picker. The result is that by choosing their favourites, users feel invested and are more likely to complete their purchase.
I joined Mirza after their pre-seed funding round. They had a prototype product that had been built by an agency, and it was clear from the data that there was a problem with retention. This was also discovered in the analytics – our users logged in once, then never returned to the product again. A further pain point was the “one-size-fits-all” approach, with a lack of customisation according to a person’s stage in the journey to parenthood.
Our solution was to create to this was creating an personalised dashboard, which would act as the hub for financial planning for parenthood. Based on the information given during onboarding (what family stage a user was at), users were offered custom content specific to that user persona. The core features would remain the same for all user types.
Our algorithm calculates the parenthood penalty and other costs associated with parenthood. As inputs the product team were required to collect a lot of information from our users. How do we do this without inducing cognitive load, and inevitably increasing drop-off? The outcome was a gamified process of entering in data in a step-by step wizard, while the bar graph updated live. The gamified approach improved completion rate, while the bar graph was proven to offer users positive feedback during data entry.
The world of financial planning for parenthood can be overwhelming. Not everyone is already equipped with the knowledge of tax credits, parent-targeted investment vehicles, fertility treatment, and school selection. The answer to our users’ feelings of confusion were education cards. In each section of the flow, we implemented these cards to offer unbiased content. This helps users make informed choices that are right for their personal situation.
There were a vast number of different parent user types we identified during user interviews and research. As the core features of the product relied heavily on the product team to deeply understand each user’s motivations and needs, we spent a considerable amount of time running interviews and testing sessions, while constantly iterating on our core user personas.
Although it was important for us to consider these different user types, during the build of our beta product we identified early adopters as working women and men who are actively planning for parenthood. These were the target of the first version of our product, and from there we expanded our reach to wider subgroups.
At all points in the product process, I ensured that my team championed fast prototyping to validate ideas and new concepts. We created pools of user testers who we frequently tested with, making sure that recurring issues or feedback were iterated on before handing over to build.
Once we had our wireframe prototypes validated through user testing, we then expanded on the designs to make them high fidelity in compliance with our design system. Once this process was complete, in some cases we then conducted further user testing. This was to ensure the core function of the feature was not lost when branding and colours were applied.
As part of a wider project to improve efficiency in my team, I oversaw the creation of a full design system for Mirza. This went hand-in-hand with a full brand redesign including logo and colour palette. This design system was created ahead of the expansion of the product team began, which would require a source of truth for styling and re-useable components. The system ensured that the design would remain consistent as the company scaled.
When I first joined Hollabox, the current live app was underperforming. There was a serious lack of retention amongst the existing users, and many of the user journeys seemed to be unintuitive.
In order to identify the pain points with the current product, and to also get to know the Hollabox userbase, my UX team and I set out on a discovery phase. This discovery process included conducing user interviews, creating user personas, drafting/editing user stories, creating customer journey maps, and reimagining the sitemap and information architecture.
Once my UX team and I had completed our discovery phase, we then started to prioritise what action to take first.
We used our new-and-improved personas and customer journey maps to draft up user stories for the new features.
The previous Hollabox video player was a recurring point of friction during our user testing. The previous player design had no progress bar, so users had no concept of where they were in the flow of content. The videos were also cropped in order to fit in information, which meant many of the video content and captions were being missed.
To resolve these issues, we added a progress bar at the top of the screen, intentionally using a similar design to Instagram in order to ensure intuitive and familiar feeling amongst our users. We also increased the size of the video section, making sure that the filmed content was the focus of the interactions.
To view venue information and access CTAs – get directions, book and share – users would previously have to click to open a model over the video content. This interrupted the natural flow of video, and produced friction to accessing the CTAs.
The reimagining of how to view venue information resulted in a swiping function to reveal venue details, in a similar way that users use Google Maps. This meant that users could access CTAs without stopping their stream of video, and made the experience of viewing venue information less clunky.
Another pain point we discovered during our testing was that users would find venues in our product, but then have no idea to access them again when they next logged in. To combat this, we prototyped then implemented a 'save to collection' feature, which allowed users to save venues within their own collections.
In the world of user-generated content, it's common to get users to help you in organising and categorising the content before they post. This is something that didn't exist within the upload process, and the addition of tags was being implemented manually by a team member.
To address this, we automated tags by adding a step to the upload function that allowed users to search for and add new tags related to each venue. These tags were then reviewed periodically by a team member, which massively reduced their time spent on the task.