Building a visual data flow editor for streamlined personalization service delivery

Overview

My tasks
- Product discovery and user research
- Conceptualization and validation
- Product design
- Design system building
- Prototyping
- Data design
- Product strategy

Mission
Gravity is a personalization service vendor providing state-of-the-art recommendations for large enterprise companies. Gravity recognized the potential of their customized recommendations but stuck to providing a streamlined method for this customization for their clients.

Customers and inhouse data teams lacked a proper tool brought together data flow design, and optimization - data life cycle management.

My mission was to start to validate the possibility of a tool, 
that can merge these needs and solve them in one place.

Discovery to Mission statement

double diamond
stakeholder management
persona creation
disovery interviews
inisght managememt
problem deffinition

Throughout the months-long discovery process, we organized user interviews to build a solid understanding of how clients interact with their data across our, their own, or with third-party data collector and management platforms.

The other pillar of the research aimed to deepen our understanding of the client-side operational and decision-making process related to data utilization. We delivered this research through remote discovery interviews channeling in insights from client-side business unit leaders and analysts, data engineers and developers related to the data-pipeline operations, and external consultants.

At this point, in-house decision-makers and stakeholders could brightly see that we have to come up with a new solution delivering a collaborative platform for data engineers, integration-side developers, and data team leaders to have a common understanding and livable control over the recommendation systems' output.

Problem space to scope definition

persona creation
user stories
user journey
jobs to be done
uml - process design
scopeing

Through a series of weekly recurring workshops, we involved the developer team and the data team to break down the jobs that have to be done by internal and external data professionals if we want a reliable process for how we ship recommendations to large enterprise companies. 

With the needs of the key personas in mind, we have begun designing the initial processes and possible flows, while also attempting to structure the list of other functions related to data flow management to get a full picture beyond the project's scope.

How might we

brainstorming
design studio
story-boarding
wireframing
brainwriting
crazy 8
best practice research
co-creation

With further co-creation sessions and design studios we started to identify the most viable and feasible interaction concepts and to define the most fundamental building blocks of what a data pipeline has to be designed by.

Due to the extremely abstract and highly complex tasks that users had to accomplish, the vision was to visualize the data flow in a way that could be both holistic and detailed at the same time.

At that time, whiteboard applications were not yet widespread, making it challenging to provide examples. Eventually, by analyzing 3d tools, architectural, game-development, and pre-production software cases we decided to develop our own whiteboard tool.

Design

rapid prototyping
adobe xd
adobe xd
javascript
high fidelity
atomic design
system blueprint
figma
svg bezier rendering
co-creation

Highlighting the most important aspects, the design process consisted of the following steps:

  1. Co-creation workshops kick-started the design phase, where we laid down the structural and terminological fundamentals from what we formed a dictionary to define essential functions and operations that users have to be able to do with data.
  2. Based on our common definitions I built up the first iteration of the information architecture, and we defined the most critical user activities and flows.
  3. During the wireframing I translated our ideas into visual blueprints, laying the foundation for the user interface's structure and functionality.
  4. Design Kit development provided a unified visual language, streamlining the design process and maintaining consistency across the whole user journey
  5. High-fidelity screen designs brought our concepts to life, offering polished and detailed representations of the final user interface.

Prototyping

adobe xd
javascript
scss
git
design reviews
system blueprint
figma
svg bezier rendering
co-creation
frontend development
invision

In the first step, we had to map out and analyze feasibility limitations, and the critical components of a deeply visual interaction where, zooming and paning and connecting boxes will be the essentials of usability.  

Since we had benchmarks about whiteboard interactions and ergonomics (Illustrator, Shaderforge, Blender) we decided not to test separately the usability of the whiteboard solution, we rather made tests to understand if the users can effectively and confidently interact with the new data operations and representations - so we focused our resources to iterate these aspects.

After the first live demo, the in-house data team became the early-adopter group that started to use the unpolished product - their preliminary insights transformed into a co-creation, where we defined most of the roadmap items together.

Rollout and post-launch

journey management
user journey
stakeholder management
client management
release management
roadmaping
product board

As we understood it in the discovery phase the success of our solution won't be affected only by the well-designed data flows, filters, and best- performing recommendations, but on that how the business part of the other teams will prioritize the common tasks.

After the rollout, we invested a lot to highlight our data-editor's benefits to convince client-side professionals - in belief that they will be our inner ambassadors who possibly will help us to move along with projects, or help to convince decision makers to choose us.

Personal takeaways

  • During the project I couldn't realize that not every stakeholder was as convinced about the solution as we thought - people originally in love with CLI and self-written Python scripts not necessarily would trust in a strongly visual solution - luckily, they ended up being the product's biggest fans.
  • This project brought along numerous opportunities for personal and professional growth. I learned how to adapt to a rapidly changing startup environment as a designer - how to be agile.
  • I experienced the benefits and power of well-prepared workshops.
  • I learned how crucial it is to find internal supporters for a design project in decision-making and execution.
  • I also learned that not just designers and strategists can be excellent product thinkers, but even developers or customer success fellows.
  • Finally, at this point, I decided to focus more on product strategy and service design to move more toward my journey of design to find and deepen my authentic character in the field.

At the end of a truly exceptional journey, the company's management entrusted me with the honor of being the coordinator of this and related products as a product manager.

Finally, I have realized that Hick's law and the industry built on to reduce the effects of it - will determine the future of humankind.