Faranak H
{{ availabilityLabel }}

Product Designer turning complex systems into clear, useful experiences.

I design B2B SaaS, enterprise platforms, and digital products that make complex workflows easier to understand and use.

Experienced across responsive web, AI-enabled products, internal tools, and consumer experiences.

Selected Work

A mix of real-world product work and concept explorations across enterprise, SaaS, AI, mobile, and consumer products.

Portrait of Faranak Hosseini
About Me

I'm a Product Designer focused on making complex digital experiences feel simpler and easier to use.

My work spans enterprise platforms, B2B SaaS, internal tools, dashboards, responsive products, and emerging AI workflows — from early product thinking to polished UI.

More About Me ↗

My Focus

{{ f.n }}

{{ f.title }}

{{ f.body }}

About Me

Product design for systems that don't explain themselves.

User Experience Designer @ FGF Brands She / Her Canada

I'm a Product Designer focused on making complex digital experiences feel simpler, clearer, and easier to use.

I currently design enterprise and internal tools at FGF Brands, and I've worked on AI interfaces at Vosyn and freelance products across digital media and e-commerce. I enjoy moving between structured systems and consumer-facing work, from research and early product thinking through to polished UI.

My work is hands-on user experience design as much as interface design — mapping flows, testing with real users, restructuring information architecture, and iterating on what the sessions show.

Portrait of Faranak Hosseini

Experience

{{ e.years }}

{{ e.role }}

{{ e.org }}

{{ e.body }}

Education

{{ ed.years }}

{{ ed.role }}

{{ ed.org }}

Expertise

{{ t }}

{{ g.title }}

  • {{ c }}
Contact

Let's Connect

I'm always open to thoughtful product design opportunities and interesting teams.

{{ c.k }} {{ c.v }}
← Back to Work {{ cs.name }}{{ cs.type }}

{{ cs.caseTitle }}

{{ cs.subtitle }}

{{ bannerAlt }}
{{ cs.heroShot }}

Overview

{{ p }}

{{ f.k }}
{{ f.v }}

{{ problemKicker }}

{{ cs.problemLead }}

{{ cs.problemBody }}

{{ pt.title }}

{{ pt.body }}

The problem was not capturing more information. It was turning context into action.

Finding the gap between thinking and execution

I reviewed patterns across project-management tools, collaborative whiteboards, documents, and AI assistants to understand where each model worked well — and where the workflow broke down.

{{ p.n }}

{{ p.title }}

{{ p.body }}

Opportunity

Combine the flexibility of messy input with the structure needed to move work forward.

My Role

{{ cs.roleBody }}

  • {{ r }}

{{ processTitle }}

{{ m.n }}

{{ m.label }}

{{ m.body }}

Not a pipeline

{{ cs.processNote }}

I audited the existing tools and workflows, then reorganised the experience around three simple stages.

Report Investigate Analyze
{{ s.n }}

{{ s.title }}

{{ s.body }}

SafeFlow UX process: pain points, journey mapping, sketches, wireframes, mobile exploration and visual direction
Mapping the journey from early exploration to a unified product experience. Click to enlarge

The interface follows how teams think

Instead of organizing Nova around AI features, I organized the experience around the progression of the work itself.

{{ s.n }} {{ s.label }} {{ s.note }}
⌘K Command palette Available everywhere
Rationale

The product needed to support both a guided setup journey and the non-linear way real project work happens after setup.

Testing the interaction model before the visual design

My early sketches focused on three questions:

  • {{ q }}

From rough idea to focused workspace

What changed after people used it

I put the first version in front of a few people planning real trips together and watched where they hesitated. Three assumptions did not survive.

{{ it.n }} · First direction

{{ it.before }}

What I saw

{{ it.saw }}

Where it landed

{{ it.after }}

Every change made the app quieter, not richer.

{{ decisionsTitle }}

{{ d.label }}

{{ d.title }}

{{ d.body }}

{{ d.caption }}
{{ d.caption }}
{{ d.caption }}
{{ d.caption }}

{{ screensTitle }}

One continuous path from context to execution

Desktop app
Overview: the day’s safety picture — volume, balances of open work, and reporting trends in one view.
5 Why tracker: monthly completion, on-time rates, and red flags, so overdue investigations surface early.
Balanced scorecard: KPIs across sites, severity mix, and hazard trends for leadership review.
Mobile app
Mobile reporting screens: incident capture and the guided root-cause step, designed for one-handed use on site.
01 — Capture

Start with the mess, not a blank form

The source brief stays intact on the left while Nova extracts goals, requirements, constraints, risks, and open questions on the right. The middle column shows what is being pulled out, as it happens.

02 — Structure

A reasoning workspace, not a wizard

Fragments on the left, AI-proposed clusters in the middle, workstreams on the right. Every cluster carries its own accept, edit, merge, and reject controls, so the structure is reviewed rather than accepted wholesale.

03 — Canvas

Approved context becomes a spatial plan

Goals, design and engineering workstreams, risks, decisions, and milestones sit on one canvas with their dependencies drawn between them. A minimap keeps orientation as the plan grows.

04 — Decisions

Decision intelligence, not a notes page

Each decision keeps its owner, evidence, alternatives, risks, and final rationale in one place. Nova reports the downstream impact beside it — here, three blocked tasks and a week of timeline shift.

Detail — Nova detected 2 impacts

Detail: the impact panel states what a delay costs before anyone commits to it.

05 — Command

AI when you need it

The command layer gives fast access to actions such as finding blockers, summarizing changes, surfacing open decisions, and generating next steps — reachable from anywhere in the workspace.

Detail — global search and command entry
  • {{ c.key }} {{ c.label }}
06 — Workstreams

Structure carries into execution

Accepted clusters become workstreams with owners and progress, so the plan and the work stay the same object rather than diverging into a separate tracker.

07 — Timeline

Conflicts surface before they cost a sprint

Workstreams run as horizontal bands with risk markers inline. When design approval creates a three-day QA conflict, Nova says so and offers rebalance, review, or ignore — the user still decides.

01 — Home

Open on what needs you

The first screen leads with an invite waiting for a reply and the trip that is closest, so a member who checks in briefly sees the state of things without opening anything.

Orbit — home
Orbit — trip overview
Home · Trip overview
02 — Places

Saved once, visible to everyone

Every saved place carries its category, rating, and who voted for it — so the group can see what has support before anything reaches the itinerary.

Orbit — places

Vote counts sit on the card itself, not behind a tap. The bookmark state is the only affordance that changes, which keeps a dense grid quiet.

  • {{ n.n }} {{ n.text }}
03 — Plan with Orbit

The group sets the terms before AI plans

Pace and budget are chosen up front, the plan states what it matched and what it saved, and every stop can be locked, removed, or refined. Orbit assists; the group still makes the call.

{{ s.alt }}
{{ s.step }} {{ s.label }}
04 — Desktop

The same trip, more room to arrange it

On desktop the itinerary becomes a planner: travellers and saved places stay in view while the day is reordered, and the AI panel reports its reasoning as it works.

{{ m.slot }}
{{ m.caption }}

UI System

Warm, photographic, and quiet enough to let places lead

Palette
{{ c.name }} {{ c.hex }}

One terracotta accent carries every primary action and active state. Everything else is warm neutral, so trip photography stays the most saturated thing on screen.

Type scale
{{ t.sample }} {{ t.meta }}

A single grotesk across the product. Hierarchy comes from weight and size only — no second family, no italics.

Components
{{ c.name }} {{ c.spec }}

Cards, chips, and sheets share one radius family and one border weight, so a dense screen still reads as a single surface.

{{ r.n }}

{{ r.title }}

{{ r.body }}

Walk the Platform

Live interface · scrollable
Scroll inside the screen to explore the platform

The full platform, end to end — reporting, investigations, dashboards, and resources in the order a safety lead moves through them.

Design System

A system built for reviewing machine output

Most of Nova's interface exists to make an AI interpretation legible. That put unusual demands on the system: every generated object needs a state, a source, and a way to be refused.

{{ n.k }}

{{ n.v }}

Colour, type, buttons, inputs, status chips, the source-to-suggestion pattern, and the command palette — documented as one sheet.

Outcome

{{ cs.outcomeLead }}

{{ m.v }} {{ m.k }}

{{ reflectionTitle }}

{{ cs.outcomeLead }}

{{ p }}

Next Project

{{ cs.nextName }}

{{ cs.nextTagline }}

View Case Study ↗