The Difference Between Wireframe Mockup and Prototype and Their Roles in the Design Process

mins to read

Designing a product is a complex and multistep process that results in many design deliverables. Therefore, there are many professional terms in UI/UX design, but the difference between wireframe, mockup, and prototype cause particular confusion among product owners who are not familiar with design. People often believe that these three terms are one and the same thing, and because of this, when communicating with a designer, misunderstandings arise.

For Eleken’s team, whose main duty is to provide UI/UX design services, creating these three deliverables is some kind of a daily routine. And to help our readers avoid such misunderstandings in the future, we will analyze in detail the features of prototype vs wireframe vs mockup and explain the place of these three concepts in the design process.

What is a wireframe?

A wireframe is a set of schematic (usually black and white) blocks that outline the arrangement of the elements on the future website/app interface. It usually shows the layout of the buttons, visuals, copy, but doesn’t go into details presenting only the main design ideas.

For example, below you can see a wireframe designed by Eleken for TenderX, a freight tendering platform. To tell the truth, such kind of platform is anything but simple. That’s why to be able to focus on the main screen contents before diving into details, our designers created wireframes.

We can compare a wireframe to a building plan: it serves as a guideline for builders during construction (in our case, during website/application development), but it is impossible to live in such a building. It does not perform any real functions of the product yet. Like building a blueprint, wireframes align the product vision with user needs and the product's technical capabilities.

The basic principle of creating a wireframe is simplicity. This is a static image of the interface that represents:

what blocks of content the site/application has
where exactly they are located
how they are structurally related to each other
how the user interacts with them (in general terms).

To create a wireframe a designer needs information about the purpose of the product, its target audience, and competitors. In case it is a complex project it would be better to provide a designer with the technical requirement that contains a detailed list of product features.

Why do you need a wireframe?

Basically, you need a wireframe to determine where to locate each type of content and design elements. As well, the development of this kind of deliverable is essential at the initial stage of the product design process to brainstorm new ideas, especially when you build the product from scratch.

Based on a wireframe and comments to it, you can compose the technical specification for other team members (designers, developers, SEO specialists, copywriters), as later they will lay visuals and functionality over the wireframe.

Among other advantages of creating wireframes are:

They are fast to build. As wireframes don’t depict interfaces in detail, it doesn’t take much time to create them.
They are cheap. Designers create wireframes in the same tool that they use to create the rest of the design (Figma, Sketch, Illustrator, and so on). Drawing with paper and a pen takes no money at all.
They simplify communication with a team or stakeholders. Wireframes are great to communicate and discuss different design ideas at the initial stages of product development.

Types of wireframes

Wireframes differ by the level of fidelity (the degree of exactness). There are low-fidelity and high-fidelity wireframes.

A low-fidelity wireframe is a freehand sketch or the most simplified plan created on a computer. Low-fidelity wireframes are better not to introduce to the customer without additional presentation, but they are great for the team’s internal communication.

Low-fidelity sketch wireframe example. Image credit: webdesignledger.com

‍A high-fidelity wireframe is a detailed plan with explanations for each element, connections between them, and other related comments. This type of wireframe will be understandable to the customer even without additional presentation.

A high-fidelity wireframe designed by Eleken for Pomocup

A low-fidelity wireframe can be sketched in a few minutes, while it usually takes at least 1-2 days to create a high-fidelity wireframe.

What is a mockup?

A mockup is a page or screen of the finished application design, as it will look to the user. When talking about wireframe vs mockup, a mockup is an aesthetic version of a wireframe. It is colorful, with thought-out visuals and typography, and it gives viewers a realistic impression of the future product’s look. Still, mockups are neither interactive nor clickable.

Mockup example designed by Eleken for HabitSpace

While wireframes present basic structure, functions, and content, mockup focuses on the visual components in detail and shows style, rich colors, and true content of a future product.

Why do you need a mockup?

Mockups are vital for any type of project because based on mockups, engineers will develop a product, as well, mockups will be used for marketing materials, landings, and so on.

Designers use a mockup to:

think over visual details and agree on them with the customer, since designers can create a mockup relatively quickly. Mockups also help to get customer feedback and learn their wishes or expectations for the future product look.

review the product visually, test it and refine. Unlike the black and white prototypes, mockups showcase the UI in detail which makes it a great tool to discuss what looks good in the future UI, and what elements need some improvements.

To sum up, a mockup helps to review, analyze and iterate the product both with the team and with stakeholders.

What is a prototype

The essence of the prototype is to simulate the user experience. For that reason, it should be clickable. The prototype can be made from both wireframes and mockups.

On the prototype, you no longer need to mark what each element means, and how each product feature works. To understand this, you just need to click on the piece of the interface to which you have a question. When you click somewhere, something will happen, like on a real site/app.

Main characteristics of a prototype:

It has a working interface - you can click sections and buttons on the page/screen and see what happens.
It is needed to test the functionality before releasing the final version.
Most of the elements that are planned in the final version work in the prototype.

Why do you need a prototype?

As we can understand from the characteristics of a prototype listed above, prototypes both look and function realistically. They most closely represent the future product both visually and functionally. That’s why prototypes are perfect to test and evaluate design ideas and concepts to get valuable user feedback.

Prototyping helps to:

agree on the location of the blocks and buttons and conduct usability testing
make sure that your product will meet the target audience needs
identify and eliminate potential UI and UX issues
develop new design solutions

A prototype is a great opportunity to test the usability, fine-tune the interface logic and user path of the future product before even starting the development process.

To learn about UX prototyping methods and tools read our another article What is a UX prototype?

What design deliverables to use in your project

When working on one project, it is not necessary to develop wireframes, mockups, and then alternately prototypes. On the contrary, to save resources, you can choose one or two formats and use them equally.

The choice depends on the following conditions:

Your requirements. If it is enough for you to see the general design of the future product, ask a designer to make a mockup. If you need detailed documentation for technical requirements, your choice is a wireframe. If you want to influence the logic of the product functionality itself, a detailed prototype will help.
Type of a project. When designing a product from scratch, it’s better to create wireframes and then mockups. In case, you need to design new functionality for an already existing design, then you can omit wireframes as such a product already has its visual style and design patterns, and create only mockups.
Time and resource constraints. If the project is urgent and has a limited budget, you can limit yourself to just a mockup. If it is a complex site/app with heavy functionality, you may need a prototype for large-scale testing.
The level of teamwork. If designers and developers understand each other perfectly, you can do without a wireframe and move straight to the mockup. Otherwise, the structure and functionality should still be documented to avoid confusion.

Deciding what design deliverable (wireframe, mockup, prototype, or maybe three of them) you need for creating an effective final version won’t be a problem if you have a design team you can rely on. At Eleken, we always voice our thoughts and explain the pros and cons of the chosen direction, and listen to our client’s opinions. So, if you need some help in designing a functional but simple and valuable product from your users’ standpoint - let us know and we will contact you as soon as possible.

And finally, below you will find a small test on how to differentiate three design deliverables discussed in this article:

Kateryna Mayka

Author

Table of contents

What is special about SaaS design?

The ultimate goal of a designer is not to amaze users with an outstanding user interface of the SaaS product, but to make them say "wow" to how easily and efficiently the app helped them solve their problem.

For that reason, a good SaaS design should have the following characteristics:

Flexibility

As SaaS products tend to scale up quickly a professional designer should always take this fact into account. To be able to cope with the constant evolution and growth of a cloud app, instead of spending all time and effort on creating tailored components for the current need, a good designer makes things adaptable and scalable to future needs. That means a SaaS product designer should know how to work with design systems.

After all, scalable design always pays out in the long run. For example, when we were working on TextMagic, the cloud-based company that provides a range of products for marketing, customer support, and sales, we used Wizard, a powerful design pattern to simplify the process of configuration of email marketing campaigns. In general, using the design system in this project made the whole design process faster and more productive (read more in our case study).

The fast and simple sign-up process

The next thing that lets your customers quicker discover that your product is efficient and they need it is the frictionless sign-up process.

Due to the specificity of the software-as-a-service model people access the product with their browser, that’s why they usually don’t feel comfortable filling in too much data straight away only for a trial period (especially billing data).

Designers that understand the essence of SaaS tend to make the sign-up process fast, clear, and brief. For that reason, they use short forms, remove all unnecessary information and create clear call-to-action buttons.

Let’s take a look at Trello’s sign-up process.

It is super fast and easy. The visitor sees a short fill-in form that asks only for an email address and a bright call-to-action button with a clear copy “Sign Up - It’s Free!”.

That’s how the visitor has to go through only one step to get the job done.

Clear and noticeable call-to-action buttons

When the customer uses the app, they should understand what they are supposed to do and what will happen after certain actions. CTAs help users quickly achieve their goals and easily complete tasks.

The effective CTAs that convert visitors into customers are usually of appropriate size (big enough to notice), contrasting, and have a persuasive copy.

Here is an example of a well-designed CTA created by our team for ClientJoy (former Gridle).

The headline presents the value proposition of the Clientjoy and then logically the attention of the reader goes to the contrasting call-to-action button that says you can “sign up for free”. The size and the color of the CTA make it easy to notice. To learn more about this project, check our showcase.

Intuitive and clear page architecture

The UI patterns like forms, button styles, pages, reports should hook the users. When patterns are consistent and intuitive, it makes products sticky and habit-forming.

Minimalist and clean design is the first step to eliminate unnecessary features and clutter from your cloud app. It helps users focus on the core parts of the application and bring order to the overall layout.

The SaaS product that is known for its simplicity and clean minimalistic design is Dropbox.

Even newbies for this app will easily understand how it works and what they are supposed to do. The minimalistic design and clear navigation leave no place for confusion.

Human-centered design

Designing the SaaS products requires deep consideration of users and their behaviors as the first and foremost task of any cloud software is to bring value to the customer. SaaS UX design works like an instrument that helps to deliver value and create a user-friendly and practical product.

Duolingo is a great example of a simple and highly intuitive application that has a main focus on its users. Duolingo’s design resembles a video game. It is full of interactive visuals but at the same time, there are no unnecessary elements that may confuse the user.

This application for learning languages shows what human-centered design is all about.

Optimized dashboard

SaaS products help users process big amounts of data. A good SaaS UX design essentially presents important information quickly for its users. The most frequently accessed data, updates, pending approvals, and a quick summary of key events encourage users to keep coming back.

For that reason, a designer of cloud applications should know how to make easy-to-comprehend dashboards that provide users with all the necessary data.

Take a look at the dashboard Eleken designed for TextMagic. It allows managers to quickly understand how their team is progressing and if customers are satisfied.

Based on the above principles that contribute to effective SaaS design, we can formulate what skills a designer of cloud-based software should possess.

How to hire a SaaS designer

If you're new to the world of user experience design, it’s easy to get confused trying to find the best candidate. To understand which way to look, let’s figure out:

what are the responsibilities of a UI/UX designer;
what skills, knowledge, and experience a designer should have to cope with those responsibilities;
How to reveal the candidate’s skills, personality, strengths, and weaknesses.

Understand the responsibilities of a UI/UX designer

The position of a SaaS designer requires:

To understand the specifics of SaaS business
To own the end-to-end design process including user research, prototypes, test ideas and refine designs with data and customer feedback
To state clear problems based on research and data
To identify user needs, iterate solutions
To create/work with existing design system proficiently and consistently
To choose logical UI patterns. Deliver polished visual design and transitions
To know user-centered design principles
To be able to work using modern design and prototype tools (Figma, Sketch, Photoshop, Illustrator, and such)

Define the essential skills and background

No UX designer can be a jack of all trades, an expert in everything. But there are a number of applied skills that are essential for a candidate to tackle the responsibilities of a UI/UX designer:

UX research. To create a great SaaS application, designers need to understand who their users are, what are their needs, and how they are going to use the product. To figure things out, UI/UX professionals need to conduct user research before proceeding with the design itself.
Information architecture. UX design is not only about “making things pretty.” It also requires a designer to be able to structure the content and features of the app in a way that would work for the users.
Wireframing. The design process usually starts with black-and-white wireframes to concentrate on the logic behind elements.
Visual design. The look and feel of the product have an enormous impact on how a user experiences an interface. That’s why a designer should be able to create pixel-perfect icons, buttons, and color schemes.
Prototyping and testing. To make sure your design solutions would be clear for users, a designer should be able to run user tests before the launch.

Evaluate your candidate’s background

Speaking about education, many UX designers do not have a degree in UX or a related field. It's quite possible to start a career in UX without a degree at all, replacing it with UX courses and self-education.

Instead of requiring diplomas, ask candidates to share their portfolios. There is no better way to understand the designer’s skillset and ability to come up with solutions for varying design problems than by checking their portfolio. Moreover, the portfolio also shows the candidate’s attitude to work –– something all employers are looking at.

To give you a better understanding of what a good portfolio looks like, check out examples of popular product designers Simon Pan, Jonathan Patterson. As well, take a look at the way we organize our case studies at Eleken.

Another chance for a candidate to demonstrate their expertise is a pre-hire test assignment. When we hire UI/UX designers at Eleken, we always ask them to do a quick test task. For example, to create a UI for a mobile AI messenger app (at least 3 screens).

Have a “live” conversation

An efficient work process and a successful final result are impossible without mutual understanding between you and the designer. That’s why it’s super-important to make sure you feel comfortable communicating with your potential hire. The best way to understand if you can communicate easily is to ask for a video interview.

Tell the designer everything about the future application. Share your thoughts on the target audience, monetization strategy, and unique value proposition, show the moodboard with application designs you like, and so on. Share all this information and listen carefully to designer feedback to understand if you want to work with him/her.

Prepare a list of questions

We at Eleken UI/UX agency have been interviewing designers since 2015, and through all these years we made up a chart of interview questions that allow us to reveal candidates’ personalities, skills, and knowledge.

First of all, ask a candidate how great UX design differs from poor UX design. Mature professionals have their own definition of good design and can formulate a clear and specific answer to this question.

Knowing what makes good UX is one thing. Knowing how to design good UX is another. That leads us to the question about the candidate’s knowledge of UX best practices.

Maksym, Eleken’s Design Director, says that simple questions are the best to reveal how a person reasons. He likes to ask candidates to explain to him what UI/UX design is, how UX differs from UI, and so on.

Technical questions are called to evaluate the level of the designer’s professionalism in the field. Here you want to know how a candidate builds their design process and what methods they use in their work. For instance, you may ask your candidate to walk you through the latest project in their CV.

If a candidate is serious about building their career as a SaaS designer, it’s always a good sign for any employer. So it’s a good idea to ask your interviewees about how they became designers and how they see their professional growth.

Here’s an example list of interview questions for SaaS designers:

Tell me about yourself.
What is the difference between UX and UI?
What differentiates good UX from bad UX?
Tell me about some of your favorite examples of good UX.
Walk me through your design process for this particular project.
How do you see your future career in UX design?
Do you have any questions?

Don’t forget about onboarding once a designer is hired

After hiring a designer, take some time to onboard them and establish a proper work process. Otherwise, the whole affair is doomed to fail.

So here are some tips for how you can help your designers craft high-quality products.

Make designers familiar with your product

Any designer that is hired to develop a product needs to understand perfectly how the product works. Obviously, right? Yet, it’s not an easy task to deal with such a wealth of information in a short term. Help your designers by documenting all the guides, demos and customer interviews in one place.

Explain your work process

Walk your new employee through your working process, explain how things are working and why they are working this way. Detail what rules are flexible and what is set in stone. For the first days, it may be useful for a newcomer to shadow an experienced designer.

Devote some time for training

We at Eleken hire designers with UI/UX experience. They all have great portfolios and proven skills. But what makes them a part of a team is a monthly training that teaches them SaaS design approaches that are adopted in our agency. The pet project designers should complete during their training is a perfect onboarding tool — it teaches them to collaborate with one another, get their works reviewed by peers, and help each other to create better solutions.

Places to look for a designer

With the understanding of the specificity of SaaS design, it would be easier to look through CVs and portfolios.

Let's check some places where you can find a designer for your application.

Upwork

‍Upwork is a global job search platform that offers help for employers who want to hire and manage remote professionals. Here you can find a freelancer or a freelance agency, interview them and begin to collaborate.

Here you can find profiles of app designers with their experience, reviews, and links to portfolios.

Designhill

‍Designhill is a popular creative marketplace that helps companies and individuals find professional designers to perform designs of different complexity and scale. You just have to describe your needs, fill out a design brief and wait for a response from professionals to choose the one that you like the most.

Behance

One more way to find a good specialist is to search on Behance. The site includes lists of portfolios from different designers. So you can find the samples you like, check who their creators are, and reach out to them.

We also have our works on Behance.

Dribble

Similar to Behance, Dribble provides a list of works of various designers and creatives. Filter the specialty you need ("SaaS app", "web design" "interactive design", “SaaS dashboard”, “b2b dashboard” etc.), find works you like, and contact their creators.

Check our works on Dribble.

Clutch

‍Clutch is a platform for B2B hiring decisions. There you can find design agencies sorted by objective client reviews, experience, client list, etc.

Eleken has a profile on Clutch as well.

Word of mouth

Asking your friends and acquaintances for advice may seem like a little outdated method, but don't neglect it. Talk with people you know, ask if they have contacts of designers that may be relevant for you. Who knows, maybe someone from your network has faced the same problem and can provide you with useful references.

Google

Don’t know where to find something? Just Google it! I guess you know how to use this tool perfectly well. Google gives access to a huge amount of information, but don't forget to carefully check the agencies or freelancers you find there.

Eleken UI/UX agency

We at Eleken help SaaS companies overcome product design challenges every single day. We hire and nurture SaaS design professionals capable of managing those challenges. So if you want to resolve the matter with a UI/UX hire fast and securely, drop us a line.

Final thoughts

“If you give a good idea to a mediocre team, they will screw it up. If you give a mediocre idea to a brilliant team, they will either fix it or throw it away and come up with something better.” Ed Catmull

Choosing a designer for your application is a challenging and responsible task. The quotation above once again reminds us about the importance of finding a designer who not just blindly follows your instructions, but works as your thought partner, helping you overcome complex challenges.

In case you still have some doubts and questions about designing your SaaS app don’t hesitate to reach out to us for a free consultation.

Design process

min read

What Does a Head of Product Actually Do? A Week in the Life of Head of Product

Heads of Product. They are in the epicenter of digital product leadership, but they are also the most mysterious members of product teams. They are omnipresent. They are omniscient. They are omnipotent.

*David Attenborough Voice*

Heads of Product are difficult to see in their natural habitat because of their constant busyness and non-public nature, but today you have a rare chance to observe this professional during her work.

We at Eleken UI/UX agency were lucky enough to talk with Tanya, a Head of Product from an AI-powered video meetings app called Whoosh. The company has recently become Eleken’s client, so we took the opportunity to walk our readers through Tanya’s weekly routine.

During our conversation with Tanya, we identified four main categories of tasks a Head of Product is responsible for:

Project management tasks
Strategic tasks
Product tasks
Operational tasks

Below, we will take a closer look at each category and block the time that Tanya spends on her tasks in Google Calendar. By the end of the article, you’ll have a visual understanding of what the Head of Product’s responsibilities are and how much effort they take.

Project management tasks

Since a Head of Product is a leadership role, Tanya is often busy with setting tasks for her colleagues and tracking their results. In turn, she reports back to C-level executives — CEO and Chief Product Officer (CPO). Tanya keeps project management activities on track thanks to regular daily and weekly meetings.

Daily meetings

Our Head of Product has three short daily meetings that go one after another in the morning.

9:30 — a daily call with a Business Analyst (BA) and Chief Product Officer (CPO).
10:00 — a daily stand-up with two development streams.
10:15 — a daily stand-up with two other development streams.

*Daily meetings in Head of Product’s calendar*

Weekly meetings with product team managers

Two Product Managers that are responsible for two development streams each work under Tanya’s direct supervision. Twice a week, Tanya has half-hour meetings with each Product Manager.

11:00, 11:30, Monday — setting weekly tasks for Product Managers.
11:00, 11:30, Thursday — PM’s weekly progress reports.

The Head of Product also has weekly meetings with product department leads:

14:00, Monday — weekly meeting with Art-lead to discuss art content tasks.
15:00, Tuesday — weekly meeting with marketing & sales departments.
17:30, Friday — delivery meeting with a Delivery manager and Tech Lead to discuss the team’s productivity and velocity.

*Weekly meetings with product team managers in Head of Product’s calendar*

C-Suite weekly meetings

Twice a week, our Head of Product has meetings with her manager, Chief Product Officer.

13:00, Tuesday — Head of Product discusses with CPO her own tasks for a week. For instance, last week Tanya had to do research on Saas benchmarks on Unit economics. Before that, she examined a psychological problems of Zoom fatigue.
13:00, Friday — based on the information the Head of Product got during the meetings with PMs, BA, Art and Design departments, she prepares a weekly report on the product team progress and issues to be solved.

On Fridays, there is a short meeting where PMs and Head of Product present their results, successes and failures:

15:00, Friday — Growth meeting with CPO.

*C-Suite weekly meetings in Head of Product’s calendar*

Monthly report

Once per month, the Head of Product writes a Management Discussion and Analysis report (MD&A). It includes:

A summary on product development: what has been done during the month from the technical side, in terms of CusDev, growth hacking, A/B testing, and others.
Product metrics summary: how the KPIs changed when compared to the previous month.
Competitor analysis on web and mobile. Via tools like Sensor Tower and Semrush Tanya checks how much the number of users is up or down in competitors’ apps.
Video conferencing news.

A monthly report is a lengthy document that takes around three days to write if you assign two hours per day to this task. We won’t block this time in the calendar because the week we are modeling opens a new month (and because we need some space for the following tasks).

Strategic tasks

When regular meetings are over, the Head of Product gets a chance to tackle her own cognitively demanding product tasks. To win some time for concentrated deep work, Tanya has declared Wednesday a no-meetings day.

She disconnects from operational tasks, turns off notifications and avoids communication with colleagues until a report or research is done. When Tanya is back after an hour or two, she receives a million messages, but such is the price of concentration.

Feature analysis

As we have mentioned before, Tanya has recently researched a problem of Zoom fatigue. Let’s take this case as an example.

At first, the Head of Product explored the issue in terms of psychology — why virtual platforms lead to tiredness and burnout, and how to avoid this. Tanya bundled all the information in one document and turned her insights into actionable recommendations for a product team about what they can do to solve the Zoom fatigue trouble in the Whoosh app.

All the work took Tanya about two weeks.

*Strategic tasks in Head of Product’s calendar*

Competitor analysis & testing

One part of feature planning is competitor analysis that takes several hours to complete.

For instance, the Whoosh product team has recently worked on integrating private & group chats into video conferencing. Before they started, Tanya analyzed how this feature is implemented by around 15 of competitors, made screenshots, put them in Figma pointing out good and poor choices. Then she concluded how the feature should be realized in Whoosh.

Several times a month, Tanya has a call dedicated to competitor testing. She meets with a QA team to see some competitor features in action. They record the testing so that it can be analyzed further.

*Competitor analysis & testing in Head of Product’s calendar*

Product tasks

Obviously, the bulk of the Head of Product’s tasks falls into the category of product design and development. Let’s get started with a roadmap.

Roadmap update

At the end of each month, it takes Tanya a couple of days to check what has been done, schedule and prioritize features. If anything of the plan is pending, it moves to the next month. Tanya presents the updated roadmap during the C-level meeting with the Tech Lead, Delivery Manager, СТО, СРО, and CEO.

Sprint planning & grooming

Whoosh tech team works in two-week sprints that need to be planned and tracked. That’s why the team meets biweekly to discuss what they are going to do during the upcoming sprint.

16:00, Wednesday — sprint planning call for the tech team.

A sprint planning session demands from the Head of Product significant preparation. So, earlier this day Tanya takes a time span to think of the list of tasks to be done during the sprint, determine the release version and assign tasks to team members. To decide on this, you need to check everyone’s workload…

You got it, planning before sprint planning requires a few hours of concentration during a no-meeting Wednesday.

12:30, Wednesday — Head of Product’s planning before the sprint planning call.

Another biweekly sprint activity is retrospective (“retro” for short). Before this meeting, all team members fill in an anonymous table where they indicate pros and cons of the previous sprint. On the call, the Head of Product with the tech team resolves arising problems and discusses positive moments.

15:00, Wednesday — sprint retro call.

In the middle of the sprints, the Whoosh tech team has meetings called to keep tasks clear, organized and ready to be worked on. That’s called feature grooming.

A grooming meeting brings together only a narrow circle of people who work on a particular feature. For instance, a recent call dedicated to a Google Calendar integration was attended by a backend developer, Flutter developer, Tech Lead and Head of Product. They looked at the task description, added necessary subtasks and requested UI/UX design refinements in cases something was missing.

14:30, Thursday — feature grooming call.

A logical continuation of feature grooming is a feature demo. It’s a meeting where a team that works on a big feature shows the rest of the team intermediate results.

17:00, Wednesday — feature demo call.

*Sprint planning & grooming in Head of Product’s calendar*

Design planning & grooming

Just like a tech team, product designers also require some task planning and prioritization that happens during a dedicated one-hour call. Before the call, Tanya takes some time to think of the tasks she needs to assign to each design team member for the next week.

14:00, Thursday — planning before design planning
15:30, Thursday — design planning call itself

On Wednesdays, the Head of Product has design grooming sessions. It’s a meeting with a design team where they have an opportunity to show how their work is going, ask questions and share the results. After, the results get verified on weekly usability testing sessions.

15:00, Tuesday — design grooming.
17:00, Tuesday — UX user testing + CustDev research.

*Design planning & grooming in Head of Product’s calendar*

Operational tasks

Besides product tasks that move the company forward and happen according to a roadmap, there are also operational tasks.

Operational tasks planning

Operational tasks are the issues that occur without warning and drag the product back until they are fixed. Such issues appear all the time, and the Head of Product needs to devote about an hour per day to plan some specific steps to the solution, create tasks and assign people.

For instance, operational planning sometimes happens along with daily calls. This way, Tanya starts solving problems as soon as they are discovered.

Operational tasks planning in Head of Product’s calendar — *Operational tasks in Head of Product’s calendar*

Random calls

Random calls are unscheduled short hurdles in Slack, needed to clarify a confusing point. Tanya has a huge team of around 30 people, so she has from three to six clarifying calls per day. Sometimes there are even more requests than she can handle.

For instance, on the day when we talked to Tanya, she already had three calls:

A clarifying call with a designer;
A quick call with a developer to discuss his A/B testing question;
A quick call with a QA who also had a question on testing.

‍

*Random calls in Head of Product’s calendar*

Let's call it a week

Now, when you are overwhelmed after just reading the list of tasks that Tatiana performs for the week, she wishes everyone a great weekend and closes her laptop. She needs a good rest because in two days she’ll be back to serving the customers' problems, building a great product to ease their lives and dealing with operational chaos.

It took Tanya four years to come from non-technical education and no product experience to a Head of Product leading a team of 30 people. In our upcoming interview, you will be able to read more about Tanya’s career path and Head of Product’s tips & tricks. So stay tuned!