talabat Tech
Published in

talabat Tech

A Roller Coaster Design Practice

Learnings and recommendations for product designers working in cross-functional teams.

Working as a product designer in a cross-functional team with engineers and product managers (we call them “squads”) is a lot like taking a roller coaster ride. You get to experience many ups, downs, and sudden changes in a relatively short –but thrilling– time.

What makes roller coasters work is the interplay between different forces and the law of conservation of energy. To avoid this turning into a full-on physics lesson, I’ll keep it brief: all these things work together (and sometimes against each other) to make the ride fast, unpredictable, and exciting. The only thing that stands in the way of all the fun, is friction.

As a squad, we’re all basically roller coaster engineers — always looking to make this “ride” that we call the design and development process better, faster, with more exciting results. Recently we’ve been experimenting with ways to make sure all the moving parts work together, to reach our goals, help the user get things done, and reduce friction along the way.

In this article, I want to share some behaviors we’ve been practicing to achieve this. After that, I’ll show you how it all comes together, and how you can design your own roller coaster.

1. Better and frequent communications

As a squad sharing the same goal, mission, and vision, it’s crucial to have regular alignments, reviews, and discussions. Create opportunities for this whenever you can, e.g.:

  • Share any research done with the squad early and often, so everyone has the most recent data
  • Share your very early low-fi design with the squad for early feedback, avoiding expensive changes later
  • Share the user journeys and collect feedback on the experience
  • “Hijack” the squad meetings to present designs, discuss, and collect feedback
  • Use the squad Slack channel to keep everyone in the loop at all times

2. Early involvement in the discovery

At talabat, we’ve been investing a lot more time and resources in the discovery phase. It’s a fundamental part of creating successful products, and it’s everyone’s job, not only the designer’s or the product manager’s.

  • Include the whole team in the “Understanding” phase
  • Involve the team in usability sessions and get them to talk to users, the more the team understands users pains and behaviors the more they become emotional about the users
  • Share insights and findings, or even better, synthesize the observations together
  • Share the full solution and align on what the first MVP will look like together

3. Visual ceremonies

The team really appreciates looking at screens and flows while refining and planning for the upcoming sprints.

We use Miro boards to visualize and collaborate with the squad and the broader team.

Here’s some feedback from the team, showing the value of collaborating visually:

Hey, I think it’s a great way to see the potential routes, capture feedback and identify things to validate .Your approach means that they are all there which is really good, it may help to highlight them explicitly so they can be identified without following different paths. Perhaps this would be a good way to review journeys together and align on acceptance criteria? — MB- Product manager

I like this visualized flow because it will for sure tell us if there is any missing case it’s great to live the flow — Munadel - IOS engineer

I liked it. Especially now I can visualize the user journey and leave my comments as well which can be discussed in refinement. I like the way the user journey was sliced in today's planning meeting. — Yasar- Engineering manager

4. Continuous UI review

This really helps reduce the “UX/UI debt” which can be a bottleneck for fast delivery and compromising the user experience. Work collaboratively with engineers to eliminate the root cause of the debt.

  • Always discuss feasibility while designing, don’t wait till you finalize the design and come to the team discussing how can we implement this? you will always compromise on your designs this way
  • Walk the engineers through the design before the handover
  • Be open to feedback and suggestion from the team, by now they know the users as much as you
  • Cover all scenarios and share the micro animations/interactions if any before handover. this will help the team to expect how much effort is needed to develop this flow
  • Review, Review, and add design review to “Definition of done” nothing is done if not reviewed.

So, how do you incorporate all of these things, these forces, and all that energy, into your process? The key is to not think of any of this is linear. That’s just a train. The process will always have twists, turns, loop-the-loops, faster parts, and slower parts. It’s up to your goals and your team to put it together.

This is what our rollercoaster looks like

A few things to keep in mind while riding:

  • Copy is not too small to ride. Copy and design is one living component. If you have a UX writer in the team, involve them at the very early stages of the process.
  • Ideate with your team, it’s amazing how many ideas you can get by arranging ideation sessions with the squad. Engineers are very user-centric in their own functional way.
  • Everything you do has an impact on the business, hence it’s critical to understand your business stakeholders and who would ride all long, and who would hop on in the middle.
  • Don’t let the chaos and excitement of the ride compromise the quality of the visual design. Keep technical feasibility, timelines, sprints, etc. in mind, sure, but always try to delight the user and evoke some positive emotions throughout their experience.

As mentioned, this is our roller coaster. For now. Take all your moving parts into consideration, and build your own to help your team visualize the whole process from end-to-end. And hopefully, when all these elements work together, you’ll be able to coast through the design and development process.

I hope this visualization exercise somehow contributes to how your company fosters collaboration in cross-functional teams. Leave a comment and let me know how you do it in your organization.

Fancy a ride? We are hiring designers to help us take talabat to the next level. Reach out to me at mabdo@talabat.com or Linkedin

--

--

--

At talabat we have an ambitious and exciting journey ahead of us. This can only be achieved with a very reliable and scalable technology stack that will allow us to innovate, experiment, and create great impact for our customers and partners.

Recommended from Medium

Dynamic content & colors in Figma

4 examples of pickers with colors and text — set up, lipstick, foundation sorted alphabetically, then sorted by color

How UX and costume design are more similar than we might think and what we can learn from it

Ruth Carter leaning against a backdrop of colorful costumes on racks

Breaking Down the UX of Switching Accounts in Web Apps

A checklist for conducting individual in-depth interviews

The art of collecting

Historical depiction of Ole Worm’s cabinet of curiosities

Figma component properties — broken logic or new approach?

Designing with meaning in mind — a UX case study

How APIs can improve user experience

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Mohamed Abdo

Mohamed Abdo

Egyptian Product Designer, Building delightful product experiences.

More from Medium

How people read.

Quick tips for successful design + engineer collaboration

Is it a good idea to display more offers on the main page?

Here’s to a Great Start!