YouVet
How we built a prototype that helped to secure funding for a learning system
YouVet’s founder is a university professor who decided to build a product that encourage youth to evaluate information sources critically, thus strengthening social democracy. He aimed to fast-track the startup journey – from concept to prototype, securing funding, and ultimately, launching an MVP.
To build a prototype able to attract investors, you must have a strong product team behind it. But YouVet's founder didn't have one, so he was looking for a specialist experienced in working with online learning products who could make decisions independently and streamline the MVP development process.
That's when he came into Eleken. Our past experience in designing ed tech solutions made us a perfect fit for the project. YouVet founder came to us with hand-drawn sketches, and we turned them into a complete product.
But when working with a brand-new product, our designers can’t just start building screens right away. We have to go through an in-depth research process to shape product strategy.
Using research&discovery tools to envision the future product
Our client had already studied the competitors before coming to us. However, it takes a new turn when you start thinking of competitors with designers on board. You see not just a market but a set of different solutions that you can analyze and learn from.
That’s why the list of competitors contained more than just products solving similar problems: we also had Spotify, Google trends, and social networks. Such diversity helps us to have a wide range of styles and design solutions to evoke ideas.
To build a product from scratch, we had to define the brand direction, style, and tone of voice. For that, our designer used a tool called Action scale that helps you better understand how users see the product.
Conducting action scale (brand examination)
Before creating a visual style, we have to describe the character, style, vibe of the product. We took several characteristics that we wanted to define and placed all the companies from the competitors list on the scale.
Then we thought: where do we want YouVet to be on this scale? That’s how we realized that the product should keep the balance between cartoon-like and formal. It had to stay in the middle of the scale: clear and accessible but not too playful.
Sketching
It was great to see the client coming to us with hand-drawn wireframes. Our designer went through a second round of sketching with him, this time in Figma.
That’s how we visualized the layouts to see how the app should look like and make fast decisions whether we preferred the gallery view or a social media-like feed (we chose the latter).
Prototyping
To design the prototype within the scheduled deadlines, we had to prioritize features. Together with the client, we came up with the “bare minimum” critical features and additional features that augment the product. At the prototype stage, we focused on the former.
The prior discovery process allowed us to find a visual style and layout that fit the product best. It prepared a solid base for a visual solution of the app. The way from sketches to a prototype took us one month.
The prototype was essential to attract funding for the next stage: Minimum Viable Product. Once the funding was secured, our designer returned to work on YouVet design. And once again, a tight timeline was the main challenge.
Speeding up the process with out-of-the-box tools
As mentioned earlier, time was tight. Our designer had to be creative and find ways to make the process faster. Here are some of the tools she used.
Using low-code front-end tool for admin panel
In addition to the mobile app interface for regular users, we also designed an admin panel for desktops that shows the data about materials vetted by users. Our designer used a low-code tool, Retool, to build and test the admin panel while developers were busy with other tasks.
Designing and building a landing page in three days
To save developers’ time, our designer used Framer to build a landing page containing all the key information about the project. It was made in no time and launched way ahead of the product itself to facilitate pre-launch marketing.
The product was taking shape dynamically
With YouVet, users can vet the materials they see on social media on certain topics to analyze the quality of the information. Initially, the product had to have more social media-like functionality, but the situation changed when the founder faced certain challenges.
Usability challenges of the main feed
The main flow of the app shows user news from social media and engages them to vet the sources, evaluate the legitimacy of the information, and analyze the emotions that each piece of news arouses. Our designer had to deal with several challenges to achieve the best experience possible:
These considerations shaped the design:
Users can check the original source by clicking “See more,” but this action has to be accessed via the menu, as we don’t want them to leave the app.
It allows users to go back to the text whenever they need without interrupting the vetting process. At the same time, the questions are available right away without extra clicks, as this is the main activity we want to engage users in.
After answering several questions, users can see how other people of different ages, locations, gender, race, and political views evaluated the same information source on the Overview page. Our designer decided to add a map view to simplify location choice.
It was important not to overwhelm users with excess graphs, as the target audience is mainly youth with different profiles, most of whom are not likely to have experience reading data-heavy stats.
Continuous collaboration between our designer and the developers proved to be a time-saving advantage. It helped the designer evaluate the time needed to develop a specific design solution and make necessary adjustments, ensuring that all elements remained within the timeline.
From hand-drawn sketches to MVP: the product design was ready in three months
With a prototype done in one month, the MVP design took two more months. Feature prioritizing and usage of no-code tools allowed us to shorten design time and save developers’ time as well.
Our designer handed the developers the mobile app design, admin panel, design system, and website. Now, we are just waiting for the launch to see it!
Let's design something special
If it feels like our UI/UX design company is a good match, but you still have questions about our work process, we can give you a free 3-day trial working with one of our designers.
