Alectio Onboarding Redesign

Simplifying project setup for a B2B ML data-prep platform

Alectio supports sustainable ML by helping teams prioritize data quality over quantity—reducing resource consumption and cost. I worked on simplifying project onboarding and improving navigation hierarchy so ML scientists and engineers could start projects faster and feel oriented throughout setup.

Context

Type: B2B data-prep platform for ML
Platform: Web (desktop-first)
Users: ML scientists & engineers
Scope: Onboarding + navigation/ layout redesign

Problem

Complex onboarding paths made it hard to know where to start
Too many options upfront increased friction
Limited progress visibility during setup
Navigation lacked clear hierarchy

Project Details

Role: UX Developer (Design+Frontend)
Timeline: Multi-week iteration
Team: PM / ML Eng / Frontend Eng
Tools: Figma · Angular (implementation)
Deliverables: Research synthesis, user flow, sketches, low-fi wireframes, handoff support, implementation

01. Discover

Alectio’s platform was primarily used by ML scientists and engineers. We conducted user interviews and walkthroughs of the existing experience to understand what motivates users, where they get stuck, and what slows down project setup.
Users typically used Alectio on desktop/laptop when training models, running experiments, or checking experiment status.
Methods: User interviews + walkthroughs of the existing onboarding flow

I pulled out the repeated blockers across interviews and used them to prioritize which onboarding steps needed the most clarity.

User Research | Key Insights

These themes highlighted where users lost time or confidence during setup and guided the onboarding changes we prioritized.

Users wanted a faster “time to first project” with fewer early decisions

Too many entry points and options made onboarding feel overwhelming

Lack of progress visibility created uncertainty about what’s next

Clearer labels and contextual help reduced confusion during setup

02. Define

I translated research into a clear direction by defining success criteria and prioritizing the highest-impact areas. This helped align the team on what “better onboarding” meant for ML practitioners and what we would change first.

Focus Area

Project onboarding experience: streamline setup into a guided flow and reduce confusing paths.
Navigation & hierarchy: make core views and primary actions easier to find and understand.

Success Criteria

Users can create a new project without getting lost, backtracking, or second-guessing next steps.
Progress is visible throughout setup so users always know what’s done and what remains.
Core actions and key views are easier to find because the hierarchy is clearer.
Labels and in-context guidance reduce moments of uncertainty during onboarding.

Design Requirements

Guided structure: a clear entry point and step-by-step sequence that keeps users moving forward.
Progress visibility: a persistent overview of completed vs remaining steps.
Reduce cognitive load: sensible defaults, clearer language, and help where users hesitate.

03. Design

I explored two redesign tracks—platform layout and project onboarding—by mapping key flows and iterating through low-fidelity concepts with the team. With feedback from engineering and ML stakeholders, sketches and wireframes helped us quickly test structure, reduce cognitive load, clarify next steps, and converge on a guided setup experience.

Platform Layout Exploration

The existing UI relied on a sidebar packed with actions and lacked a clear hierarchy, while the top bar was underutilized. I explored a layout that elevated the top navigation and grouped functionality into primary views (Dashboard and Projects), with user controls (notifications/profile) separated for faster access.

Onboarding Exploration

In Alectio, creating a project ({data, model}) is the entry point to most workflows. The existing experience offered multiple starting paths and required too many decisions upfront, which made setup feel slow and error-prone.

Examples of the option-heavy starting points and unclear hierarchy that made project setup harder than it needed to be.

Flow & Structure

Updated User Flow

Early wireframes

I used quick hand sketches and digital sketches to iterate rapidly with the team before translating patterns into low-fidelity wireframes.

What we aimed to improve:

Step visibility: master-detail progress so users know what’s done and what’s next
Guided setup: a wizard-style template with prefilled defaults where possible
Clarity: tooltips and simpler language to reduce hesitation

04. Deliver

Note: Final high-fidelity visuals aren’t included due to company access constraints; this case study focuses on flow, wireframes, and shipped interaction changes.

Solution Highlights

Navigation Hierarchy

Reorganized navigation hierarchy to surface primary views and reduce menu noise

Guided Onboarding

Streamlined onboarding into a guided, wizard-like setup with clearer next steps

Clarity & Progress

Improved step clarity through progress visibility, simplified language, and contextual help

Final layout decision: We elevated top navigation and clarified hierarchy so primary views (Dashboard / Projects) were easier to find, while keeping user controls (notifications/profile) consistently accessible.

Final Onboarding Structure: A guided setup sequence with step visibility and clearer next actions—designed to reduce hesitation and speed up project creation.

Delivery & implementation

I shared the refined flow and low-fi wireframes with the product designer for high-fidelity mockups, then supported implementation in Angular alongside engineering.

05. Impact

Task success: 100% completion for new project creation
Efficiency: reduced time-to-complete setup after redesign
Sentiment: improved post-launch survey responses (attitudinal)

Attitudinal survey (sentiment): We ran a short dashboard survey before and after the launch, asking users to rate statements on a Strongly Disagree → Strongly Agree scale. Post-launch feedback was mostly positive, with a clear request for stronger value messaging to help users understand the impact of their actions.

06. Reflection

Alectio was a turning point for me—moving from primarily front-end execution into a more customer-facing, UX-driven role where I helped shape what we built and why.

Working closely with a product designer and customer success helped me turn real customer feedback into clearer flows and better defaults, not just UI polish.
Partnering with ML engineers taught me to respect domain nuance and constraints while still pushing for simplicity and clarity in the experience.
I learned to look beyond the “happy path” by spotting hidden assumptions and expert workarounds—then designing onboarding that supports both new users and power users.

PT