Vocal is an established storytelling platform for millions of creative writers and their audiences, focused on expanding its available features to drive engagement from users of all types.
My work within the Vocal team at Thinkmill focused on design and integration of new web features, progression/solidification of the Vocal design system and design of the new Vocal app to drive engagement from existing users and expand platform offerings to acquire new users.
For the first part of my engagement on Vocal my primary focus was working rough product shaping wireframes into finished UI and sparring on ideas with the development team to ensure we finish the design sprints with feasible solutions.
These three primary features I worked on during this phase were;
The work done on these included the fleshing out of all logic pertaining to said features. Like... what settings are found where and what conditional content is displayed when.
.jpg)
.jpg)
.jpg)
At the start of a new design sprint, the team would meet to discuss where the feature was within its wireframing/shaping journey. Its planned trajectory, gaps, strengths and weaknesses are made clear and the work is handed to myself to develop further into refined UI.
Over the two weeks for each feature, we would take meetings every 2-3 days to touch base and answer questions, present new ideas and rework things that might have not been so solid. The finished UI comes to life. This meeting cadence is then flipped within the second week to include more input from the development team to ensure the feature is simple, feasible, lovable and complete.
My biggest challenge during this time was my attempt to convince management how we might better align the reader insights feature with future plans to incorporate free form commenting on the platform. In the below concept, displaying the output from "reader insights" as simple text strings might have allowed us to incorporate free form comments into the same stream of feedback in one drawer. Ultimately saving on screen real estate.
These ideas were shelved in favor of hitting our project timelines. Ultimately I believe we ended up with two very different features fighting for attention at the bottom of a users' story, which could have been handled better if we explored these ideas more. But I understand that given our available time these ideas were too complex to be properly feasible.
The second half of my work on the Vocal platform was the design of the new app, initially launching only on IOS. The primary focus was to ensure the scope of the app was manageable enough to deploy within our deadline of just a few months AND packed with enough features so that users still feel they are receiving a full Vocal reading experience.
We as a design team had to create a new mobile design system alongside the already existing web components that felt like a natural evolution of Vocal web without pushing the boundaries so far that it still felt like the Vocal we all knew and loved.
Below is a set of frames from the product release deck highlighting key features of the new app.
The biggest challenges I faced during this project were easily that of communication and hierarchical boundaries rather than workflow and product design decisions. I have noticed that when working with the title of "junior" within a team, it may be all too easy for other designers with more time in the field to overlook your suggestions during the design process no matter how much you advocate for them.
These two primary issues were; My advocacy for setting up colour systems to match our tried and tested methodology in Vocal web (Figma and in code) was set aside in favor of simplicity for faster deployment. But in the end, the team ended up going full-circle in the pursuit of a well functioning system, landing back on the conventions put in place for Vocal web under the recommendations of the development team. Exactly what I advocated for in the beginning.
Secondly, when discussing features to be cut from the app to hit deployment deadlines. I made it known that for us to deploy the app onto the IOS app store, users must need the ability to delete their Vocal account. This was also set aside and the project lead decided to gamble on deploying with this missing feature. The app was knocked back by apple, delaying our release date a little further back than it would have if we just included the feature from the beginning.
.png)