Our Design Process Toolkit

Ivan
Alcumus Design
Published in
5 min readSep 12, 2022

Hello from Alcumus

This is our first Alcumus Design blog post, so hello! Welcome. We want to tell you about us and our team here at Alcumus.

At Alcumus, we deliver solutions to help anticipate, manage, and mitigate risk to people, organizations, and our planet. We are a leading provider of software-led risk management products. Leveraging data and technology to drive a modern culture of health and safety compliance and sustainability.

Our design team is distributed globally, with HQs in North America and the UK. The Alcumus Design team works alongside our Technology and Product teams to create engaging and user-centric solutions.

When we work on any project, we start by exploring the problem space and understanding its user and business needs first. One of the tools that we’ve created to ensure that we take the necessary time to define a problem is our Design Process Toolkit. This toolkit is a collection of design templates organized in one file for designers to copy and paste into their projects. The toolkit follows the 5W format and includes examples of ways to answer each of the 5W questions (Who? When? Where? What?). The toolkit reminds us not to skip any of these essential questions before moving ahead in the design process. This article will explain how and why we created this helpful resource. You can also start using the toolkit yourself here.

Consistency Issues

As our team grew and new members joined, we noticed a lack of consistency in how we defined problems and documented our work. This lack of consistency was especially noticeable on small to medium-sized projects where the urge to jump straight into high-fidelity mockups was very tempting. We discussed this issue during one of our team retros, and we decided to brainstorm how we could improve our process.

The two main goals that we wanted to achieve were to

1 — Give an example of how to deeply explore a problem before moving into wireframes or mockups

2 — Provide a flexible tool so designers can have autonomy around how they choose to work

Brainstorming Using the MoSCoW Framework

We ran a series of workshops to help us shape what the output of this project could look like. We started by listing all types of design documentation our team has created throughout past projects. We then prioritized them using the MoSCoW framework to determine the most high-value items we should include in the toolkit.

Brainstorming using the MoSCoW Framework

A few examples that we assigned to the Must Have column were

  • The problem statement
  • Business goals
  • User needs and pain points
  • Personas
  • Proposed user flows

The Should Have section included

  • Existing user journeys
  • Competitor screenshots
  • KPIs and project goals
  • Planned or relevant research

The 5W Format

During our discussions, we realized that a common thread in our documentation was the 5W framework. The 5W approach aims to answer a given project’s Why, Who, When, Where and What to get a holistic perspective of the problem and its potential solutions.

5W Canvas from Artyom Dashinsky — https://productdesigninterview.com/

For the next step of this process, we grouped the stickies from the “Must” and “Should Have” columns according to the Ws in the 5W format.

Then, we sourced documentation examples from past projects — this put us one step closer to displaying “what good looks like” in the context of the problem definition stage of our process.

Deliverables grouped in the 5W format

Avoiding Strict Guidelines

Our team decided to create a new file for these documentation templates to make them easily reusable. We spend most of our time designing and collaborating with developers and other stakeholders in Figma — so it only made sense to host the toolkit as a Figma Library. All we had to do from there was recreate these documentation pieces as Figma components.

One thing we value on our team is having the flexibility to use the tools that best fit into our workflows. We decided to include multiple formats for the same deliverable type in the file. For example, we have different formats for defining a problem statement. It doesn’t matter which template you choose if you answer the Why by explaining user and business needs for your problem. We wanted the toolkit to be an informative guide instead of strict guidelines.

When & Where — different ways of describing the context around the problem

Much like our brainstorming file, we grouped the templates according to the W’s in the 5W framework and placed them on separate pages. We added an overview page for new team members to get familiar with the file.

About page with an overview of the Toolkit

Improved Communication

Since implementing the Process Toolkit, the most significant improvement we have seen is how we communicate and collaborate within the design team and with our product squads. Instead of discussing the details of a problem while sharing static wireframes, we have documentation to refer to that clarifies the project’s Why. These new templates help us involve Project Managers and Developers earlier in the process and align on the approach as a team. On top of that, design critique sessions yield significantly higher quality feedback when there is a clear understanding of the problem context, user journey and potential solutions.

Try it out

You can view and download our Toolkit on Figma Community. We would love to hear if this is a resource that fits well within your team’s process. If you find it useful or if you have feedback for us, let us know!

We are currently growing our design team and have several exciting new opportunities. If you’re interested in making an impact on the lives of others and being a part of a rapidly growing global organization, we hope you’ll consider joining us!

Learn more about our openings on our Careers page.

--

--