Skip to main content

2019

Me - Securibox Account

Account identity hub and connected-services surface — profile, credentials, data transparency - one account layer serving the entire Securibox ecosystem

Role

Technical Product Designer & Frontend Developer

Skills

Cross-product identity architecture · Data transparency UX · Ecosystem visibility · Scope discipline

Tools

Figma · React · Vite · Redux · Bootstrap · Accessibility (WCAG)

Case study

Designed and built the account hub that gives users a single home for their identity, connected services, and data-use transparency across the Securibox ecosystem — with inline explanations of how each piece of personal data is used.

Dimensions 3, 5
Outcomes
Unified identity layer across all services
Single source of truth for user data
Profile, credentials, and language preference management
Connected services grid with app discovery, sort, and direct navigation
Contextual data-use transparency — per-field explanation visible during editing
Account deletion with per-service consequence disclosure and export guidance
Context

As the Securibox ecosystem grew — Cube, SCA, RH, ParseXtract, and client portals — users had no central place to manage their identity. Profile edits, password changes, and connected-service visibility were scattered or absent. Each product either rolled its own account fragment or had none. Users couldn't see which services were connected to their account, couldn't manage credentials from one place, and had no visibility into how their data was used across the platform. The result was friction, redundant support requests, and eroded trust in a platform that needed to feel unified.

The account challenge:

How do you give users a single home for their identity and connected services — without duplicating product-specific settings or creating another silo?

Key decisions

Decision 1

Scope

Account layer, not account product — drawing the boundary

Me manages what belongs to the user across the ecosystem: profile, credentials, language, data-use transparency, and service connections. It does not manage product-specific settings — Cube's sync preferences stay in Cube, SCA's agent configurations stay in SCA. The decision to enforce this boundary was critical: without it, Me would have become a dumping ground for every product team's settings, growing unwieldy and defeating the purpose of a focused identity hub.

Decision 2

Transparency

Data-use explanation inline — not buried in a privacy policy

Each account field (name, email) has a contextual sidebar explaining how Securibox uses that information and why it matters. This wasn't a legal requirement — it was a design decision to build trust. Users editing their email see, in the same view, that it's used for sign-in, password recovery, and cross-product communication. The explanation sits beside the field, not behind a link to a 40-page policy. The same principle extends to account deletion: consequences are listed per-service (CloudAgents, ParseXtract, Cube, RH), external storage caveats are explicit, and export is recommended before the destructive action.

Decision 3

Services

Connected services as a visible surface — not a hidden admin panel

The 'Services & Applications' tab shows every Securibox service connected to the user's account as a card grid with direct actions (Website, Go). This makes the ecosystem tangible — users see the full scope of what their account touches. The app marketplace card ('Add apps, get work done') and search serve discovery, not just management. The 'Recently updated' section at the top gives users a reason to return: awareness of changes across their connected services without visiting each one individually.

Implementation

Design

Account experience

  • Two-tab architecture: 'My account' for identity and credentials, 'Services & Applications' for ecosystem visibility and service management.
  • Sectioned account page with in-page navigation (Account, Password, Delete) and inline edit — no modal interruptions for common tasks.
  • Contextual data-use transparency: per-field explanation sidebar ('How do we use your information?') visible during editing, not hidden behind legal links.
  • Password staleness signal (days since last update) surfaced directly in the UI — a trust cue that nudges without blocking.
  • Account deletion designed as a multi-step disclosure: per-service consequences, external storage caveat, export recommendation, and explicit confirmation — destructive action treated with the weight it deserves.
  • Connected services grid with app cards, sort, search, and direct navigation — making the ecosystem tangible and discoverable.

Code

What was built

  • The live Me hub (me.securibox.eu) implements the specification in coordination with engineering — account UI also lives inside individual product stacks where ownership and release cadence differ by team.
  • Cross-product navigation: consistent top-level header with 'My account' and 'Services & Applications' tabs shared across the Securibox ecosystem entry points.
  • Service card grid with dynamic app data, sort controls, and dual-action pattern (Website + Go) for each connected service.
Results & Metrics
Single identity layer across the entire Securibox ecosystem
Inline data-use transparency without legal-page friction
Connected services visible and manageable from one surface
Account deletion with per-service consequence disclosure
Ecosystem discovery through the app marketplace pattern
Trade-offs & Learnings

The hardest boundary to maintain was scope. Every product team had settings they wanted to surface in Me — notification preferences, billing details, feature flags. The decision to keep Me focused on identity and ecosystem visibility meant saying no repeatedly. The alternative was a settings mega-page that would grow with every product release and become nobody's responsibility.

The data-use sidebar was initially planned as a tooltip. Testing showed users dismissed tooltips without reading them. Moving the explanation to a persistent, always-visible panel beside the form changed completion behaviour — users paused, read, and edited with more confidence. A small layout decision with outsized trust impact.

The 'Recently updated' section ships empty for new accounts ('No updates yet!'). This was intentional — showing an empty state rather than hiding the section establishes the mental model early. Users learn this is a place to check back, even before there's content.

An account hub that shows users what their identity touches — and explains why.

Transparency as a design decision, not a compliance checkbox.