Led the end-to-end design of Templates for MeisterTask, a cross-product feature aimed at simplifying project structure and improving onboarding. Grounded in user research and iterative collaboration, the solution introduced scalable, preconfigured workflows that increased user retention, engagement, and revenue while establishing a foundation for future expansion.
In response to user demands and in pursuit of optimizing MeisterTask's functionality, I embarked on a pivotal project that focused on Templates – a feature eagerly anticipated by our user community. This case study outlines the journey of conceptualization, design, and delivery of this feature, shedding light on the challenges faced, methodologies employed, and the transformative impact on our product ecosystem.
The MeisterTask user base consistently articulated two primary requests: the integration of Templates and a Cross-Project Timeline feature. This case study zeroes in on the Templates aspect, tracing my leadership from project inception to the eventual handoff. The project spanned approximately 11 months, encompassing planning, design, development, and refinement phases. This venture held special significance as it marked Meister's first cross-product project, bridging MeisterTask and MeisterNote. This cross-product nature necessitated process adaptations for distinct user segments and product maturities.
Users evidently encountered challenges in comprehending the hierarchical structure of Projects | Sections | Tasks, leading to difficulties in organizing their responsibilities coherently. Addressing this issue was crucial, as a lack of user understanding could impede business growth. Templates emerged as a strategic solution to offer preconfigured projects, streamlining user onboarding and enhancing familiarity with MeisterTask and MeisterNote.
The principal objective was to establish the framework for delivering five initial templates, with plans for expanding the collection over time. Design-wise, collaboration with essential stakeholders – Product Managers, Designers, Engineers, Marketing, and Sales – was paramount in constructing this foundational feature.
A diverse array of research methodologies was employed to ensure informed decision-making. Among these, user interviews emerged as the most influential. Facilitated by the Sales team, my PM and I engaged with ten users, delving into their MeisterTask adoption journey, alignment with their needs, and potential service enhancements. During these interviews, Templates emerged as a unanimous preference, demonstrating their pivotal role. Further insights were gleaned from conversations with clients by our Chief Product Officer, enriching our understanding.
A comprehensive examination of industry competitors – such as Monday, Asana, and ClickUp – revealed that templates were already entrenched in their offerings. This analysis served as a source of inspiration rather than imitation, influencing the approach for MeisterTask templates. Takeaways from this analysis included the necessity for template titles, succinct descriptions, and intuitive illustrations to convey template content effectively.
Meister's Community platform, an avenue for user interaction, proved invaluable. A perusal of the feature request thread for Templates from September 2022 yielded user desires:
Synthesizing research findings and guided by the Product Manager, a clear trajectory for MeisterTask's templates emerged:
Considering the insights shared during the Research phase and using our design language, I let my ideas flow freely and created 45 screens. Some areas had numerous variations, such as the Template shop, where users would browse available templates, the Template view, and the Search results. I aimed to determine the most effective layout to make templates noticeable, easily understandable, and usable. Here are some explorations I did.
I incorporated known concepts from our current UI; sidebars with icons are used across Meister's products and are familiar to users. The categories presented there are already used in MindMeister. The "shop" idea was explored, where users can browse all available templates. Some are personalized based on the user's profile (e.g., Business user or belonging to a specific industry). This dynamic approach based on the user's profile aimed to provide inspiration, usability, and up-to-date offerings.
After the exploration shared above, I organized a workshop with the Design Team to further develop the concept and challenge my ideas. This exercise was beneficial, as it allowed me to step back from the project. We discussed various aspects, including the sizing of views – having a sidebar makes the view larger, for instance.
During this design phase, it was important to consider the moving parts that could significantly impact designs. For instance, the number of templates – starting with 5, all templates could be seen at a glance without a sidebar. However, preparations were needed for 10, 50, or 100 templates. This influenced navigation and content presentation. These moving parts were discussed with engineers, marketing, and the product manager.
The content of the template view was also a key discussion point. We didn't have the final content marketing would provide for this view. From the design side, we agreed on having the minimum content – a title, a short description, and a screenshot. Additionally, templates would have an illustration and an icon.
Some ideas were discarded along the way, such as linking free trials, the sidebar, the search, and sharing a template. Decisions were made based on starting with a limited number of templates, utilizing features available to all plans, and addressing engineering questions about sharing templates.
You can also observe changes in the button style between iterations due to ongoing design discussions. The main color representing our brand was being reconsidered during this time – shifting from a light blue to a navy blue, reflecting in the designs.
The welcome screen's evolution aimed to engage new users and showcase what MeisterTask offers. The illustration was initially removed but later reintroduced. The screen's goal shifted from a simple welcome to highlighting templates and allowing new users to quickly grasp MeisterTask's capabilities. It also facilitated opening invited projects directly from the screen.
On the day of posting this case study, almost 2 months have passed since the release of Templates to our users. What are the impacts?
This project facilitated my growth as a designer for several reasons: