Baton is a UX design project I have worked on while attending the UX design course in General Assembly in 2018. Given I had just left my job as a project management consultant, I want to create something related to what I have done before. Hence, Baton is created. It is a website application aimed to improve project management efficiency and effectiveness through better organising and facilitating project meetings. After interviewing 5 target users, i.e. project managers with multiple years of project management experience, I have found the following common key goals from them:
- Maintain a clear focus on the agenda in the meeting - Record all agreed meeting actions and decisions - Ensure the expected outcomes can be reached in meetings
With the feedback received, I have come up with the main components for the application which are listed below and worked on the paper sketches and a prototype using Sketch and InVision.
- Creating and sending meeting invites to attendees - Facilitating the meetings through displaying agenda, keeping track of meeting time, and recording decisions & actions This prototype was then tested with 6 targeted users to validate whether the design was aligned with users’ expectation. The key learnings from the interviews are as follows:
- The overall process for organising a meeting represented in the prototype are logical and relatively easy to understand. - The process for facilitating a meeting needs to be updated to match the user’s current mental model. - The function to record actions and decisions via voice has not been picked up by most users.
The prototype is then updated based on the feedback and the final result can be seen here. In my opinion, this project is a great practical introduction to the overall process of conducting UX design. In terms of picking up new skills, nothing beats getting my hands dirty.
👇If you have more time, feel free to go through the detail steps I have taken during this journey.
The Problem 🤔
If I can get a dollar anytime a person has complained about having a bad project meeting, I will probably be a millionaire by now. Joke aside, the issue of non-effective meetings are real and it is actually costing the economy a lot of money, like billions of dollar. Taking America as an example:
There are about 11 million meetings taking place in America every day, and a third of them are unproductive. It comes at a cost: an estimated $37 billion is lost every year to unproductive meetings. - Drake Baer, Business Insider
For me, such pain of ineffective project meetings is personal. In my previous job as a project management consultant, I would have to sit through meetings on a daily basis and a lot of them could be improved significantly. Hence, using the UX design skills I am going to acquire, I would like to contribute something positive back to the career I have once enjoyed. I want to eliminate ineffective project meetings. The idea of Baton is born!
The Users 👥
I know I have suffered the problem already, but it is important to see what the common goals and pain points people have regarding project meetings. Afterall, I am not designing just for myself, I am designing for thousands of people who are participating project meetings everyday.
For the initial user research, I am keen to get some insights from people who have mostly affected by this problem. Hence, I have turned to my previous colleagues, most of them have worked as a project manager for more than 5 years. In the end, I have managed to interview 5 experienced project managers. Some of the insights from the interviews are as follows: - All interviewees mentioned the pain by constant deviations from planned discussion topics in project meetings. - 60% of interviewees has mentioned the importance of having the right people in the meeting. The right decision makers do not always show up as planned. - All interviewees highlighted the importance of preparation prior to meetings, i.e. creating agenda, identifying outcomes, providing documents to review, and communicating with meeting attendees. - Other than one interviewee, no interviewee has mentioned a designated notetaker was involved in their most recent meetings. - Other than Outlook and JIRA, no other specific tool has been identified in helping with meeting organisation and facilitation.
To put things into perspective, I have created the following personas to highlight the common users behaviours, scenarios, and goals,
The personas allowed me to better oriented my problem-solving process and keep their goals in mind. I have further structured the problem statement using the personas of Sam and Beth.
- Sam needs a way to maintain a clear focus on the agenda in the meeting because most meeting attendees tend to deviate from the agenda. - Sam needs a way to record all agreed meeting actions and decisions because there is not always a notetaker available to help the meeting facilitator for note taking. -Bethneeds a way to ensure the expected outcomes can be reached in meetings because the right people are not always in the meetings as planned.
To better identify the features that need to be included in Baton, I have created the following feature optimisation chart. It measures and plots each feature based on the impact on users and how much expectation users would have regarding this tool.
The features highlighted in the red circles are what would be realised in the design. One thing I would like to point out that even though the "recording of actions and decisions using voice" is not what the users have expected, given its benefit in reducing writing effort from meeting facilitator and forming clear alignment of actions and decisions, I have decided to add this in as features to be included in the design.
The components to be included in the design are as follows:
- The following should be incorporated in meeting invite: * Clearly identified agenda items and expected outcomes * Linking agenda items to the specific people for decision making * All the basic information (e.g. subject, time, attendees) in a meeting invite - The following should be incorporated in the facilitation interface: * Reflection of agreed agenda and the expected outcomes * Tracking of time spent in a meeting * Recording of actions/decisions via voice command
The Design ✍️
Before touching the tools...
Before getting onto designing the interfaces, I have created two user flows to visualise what actions are expected to be taken by users. These flows not only look clear and logical but also serves as a good way to help me find out whether I have any holes in the processes.
With the user flow constructed, I can now easily see what screens would be required for each user flow. The next big question for me is what should be the platform for Baton. Should it be a mobile app or a web app? Using the survey tool from Optimal Workshop, I have managed to ask my users this question and the result is somewhat surprising:
Initially, I thought people will be more than happy to plan meetings in mobile, due to its ease of reach. However, there is an overwhelming preference to use a laptop for meeting planning and people usually will bring their laptop to their meetings. This could due to the potential lack of trust from users to plan detail activities using a relatively small interface or people just have too many apps. Anyway, I have heard my users and I will do so accordingly. A website application will be what I am going to design then.
On top of the choice of the platform, I have also tried the carding sorting test with the users using Optimal Workshop. The aim of this test is to understand whether the proposed names of screen and key action items are aligned with what my users perceived.
It does look like that I am not so bad in naming things. The only one that needs re-naming will be “View Meeting In Progress” as that is supposed to be part of the key action "Facilitate a Meeting". In the design later, I have changed that screen to “ Record Meeting Actions and Decisions” instead. With the screens confirmed, I have also created the following information architecture to better map out the screens and where they should be nested in the overall structure. Because Baton will be a web application, the functionality will only appear once the user has logged in the system.
The real design kicks in...
Now the fun part begins. To start off, I drew each key screen identified in the information architecture. To not let you lose track with the process, I will just focus on the user flow for organising a meeting in the following steps. Pardon me with the bad lighting in these photos, the initial drawings look like this.
Drawing a straight line is never my strong suit, but that is fine for a paper prototype. The key goal of this process is to visualise the key elements that need to appear in each screen. With things drawn on a paper, it is much easier for me to change elements without worrying too much about alignment and content proportion.
The next step is to create a screen on a digital tool. I can finally use some design tool. In this case, I have used Sketch for the creation of screens.
For me, the first-time usage is not easy and the main pain point is to keep things aligned in the same style. I was happy to discover the function of symbols around the end of the project. Even though they were not heavily used in this project, I am sure they will be a huge time-saver for my future Sketch projects.
The followings screens and annotations are related to the series of screens for organising a meeting.
The Tests 📝
After importing the screens into InVision and creating some hot spots for interactions, I am finally able to put this application in the hands of my users again to test whether I have delivered what they would like to see. This time around, I have managed to conduct user testings with 6 experienced project managers. Here are some of the quotes I have received during the tests:
General speaking, the results from the testings are quite positive. The key takeaways from the tests are that: - The overall process for organising a meeting represented in the prototype are logical and relatively easy to understand. - The process for facilitating a meeting needs to be updated to match the user’s current mental model. Confirmation of meeting attendance should happen before the meeting is started. - The function to record actions and decisions via voice has not been picked up by most users. Users are not aware the proposed icon is related to use Amazon Alexa to extract information. - Other key changes to be incorporated in the final prototype (i.e. issues identified from more than 4 users): * Removal of confirmation after adding each line in a table, e.g. adding an agenda item * Visual and direct representation of attendance acceptances * Creating a location to enable users to look for all raised actions and decisions
Upon receiving such feedback, I have gone back to Sketch and improved screens accordingly. If you would like to take a look at the updated version of the prototype, you can visit this InVision Link here or view this Youtube video below.
Final Thoughts 💭
Overall speaking, I have enjoyed this whole UX design process for Baton. The design process I have gone through proves to be a good practise for me to get some proper basics for UX design. The key takeaways for me are that:
- Prepare and action early: It is important to get things prepared and start actioning on them early for UX design, especially with interviewee recruitments. - Collaborate more: One thing I feel I have missed from doing this UX design is that I don't have the chance to collaborate with other designers. There are things I am not so good at, such as UI designs, and I am sure I will be able to learn heaps from them. - Trust the process: UX Design is all about the process and skipping some steps might result in major backfires in the later stage of product development. Given the restrictions in future projects, I know I might not have the luxury of following each step I have done in Baton. However, it is important to remember the goals of each step during the UX design process and advocate the needs for them where it is possible.
I would love to take on more UX design process and continue practising going through the process. In the end, practice makes perfect. If you have some product that needs a bit of UX design help, drop me a line below.
Wanna have a chat about UX design for your idea? Drop me a line!
Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.
