Skip to content
UAEN
All work

02 /2020 — 202218+

Real project

Neural WebCam

A social platform for creators, content and live interaction: roles, architecture, flows, monetization and brand identity.

  • Product Design
  • UI/UX
  • Brand Identity

The product later continued under a different brand. This case covers only my work on Neural WebCam.

Client
Neural WebCam
Role
Product / UI/UX Designer
Year
2020 — 2022
Neural WebCam logo: the symbol and the name in one line on white
Neural WebCamWork · 02 / 06
Open the live site

01 /18

Overview

Neural WebCam was a multi-role digital platform connecting users with content creators.

The product combined profiles, publications, private content, subscriptions, messaging, live experiences, virtual currency and monetization inside one ecosystem.

The main challenge was not simply designing individual screens, but building a complex system of roles, permissions, payments and interactions while keeping the experience clear and consistent.

Category
Social platform · Creator economy · Live video · 18+
Product
Web application, responsive
Roles
Guest · Member · Model / creator · Media manager
My role
Product / UI/UX Designer, brand identity

02 /18

My role

From product architecture and flows to the interface, the logo and developer handoff.

  • Product Design
  • UX Architecture
  • User Flows
  • Information Architecture
  • Interaction Design
  • UI Design
  • Design System
  • Responsive Design
  • Prototyping
  • Brand / Logo Design
  • Developer Handoff

03 /18

One product for multiple roles

The central UX challenge was supporting multiple behavioral models inside the same product.

The interface needed to remain consistent while dynamically adapting functionality to the user's role, subscription and permissions.

  • 01

    Members

    came for discovery, content and interaction.

  • 02

    Creators

    came for audience and monetization.

  • 03

    Media managers

    required a separate operational workflow.

04 /18

Product ecosystem

Fifteen connected areas around one core: the scale the interface had to hold together.

Neural WebCam

  • Discovery
  • Profiles
  • Content
  • Followers
  • Messenger
  • Live
  • Subscriptions
  • Credits
  • Tips
  • Gifts
  • Premium
  • Verification
  • Transactions
  • Referral
  • Security

05 /18

User roles

From guest to creator: every role sees the same product with a different set of capabilities.

  1. 01

    Guest

    An unauthorized visitor.

    • browses public content
    • views profiles
    • signs up and logs in
    • reads help and legal pages
  2. 02

    Member

    A client of the platform.

    • creates a profile and follows creators
    • buys premium content and credits
    • sends tips and gifts
    • uses messenger and live
    • manages subscriptions, purchases, security and privacy
  3. 03

    Model / Creator

    The creator role; a member gets it after verification.

    • maintains a profile and publishes
    • offers subscriber and paid content
    • talks to users
    • receives tips
    • hosts private and group live
  4. 04

    Media Manager

    A separate role with its own registration and verification.

    • works with creators' content and publications
    • acts within the permissions the product grants

06 /18

Information architecture

Dozens of areas from the UML boards, grouped into six domains instead of one unreadable sitemap.

Account

01
  • Sign-up and email confirmation
  • Log-in and password recovery
  • Profile and personal information
  • Settings: security, confidentiality
  • Sessions and notifications

Content

02
  • Publications
  • Premium publications
  • Paid content
  • Followers: free and paid

Communication

03
  • Messenger
  • Private live
  • Group live
  • Chat room

Monetization

04
  • Buy credits
  • Premium
  • Tips
  • Gifts
  • Transaction history
  • Referral

Creator tools

05
  • Model verification
  • Media manager registration and verification
  • Promo: banners, landing pages
  • Subaccounts
  • Analytics links

Support & compliance

06
  • FAQ, help, contact
  • Terms
  • GDPR and cookie policy
  • 18+ compliance
  • Scam recognition

07 /18

Core user flows

Seven flows the product rests on, each a few steps long and free of needless branches.

  1. FLOW 01

    Registration

    1. Guest
    2. Sign up
    3. Email verification
    4. Profile
    5. Completed profile
  2. FLOW 02

    Become a creator

    1. Member
    2. Become a Model
    3. Profile details
    4. Email
    5. Documents
    6. Role: Model
  3. FLOW 03

    Media manager

    1. Registration
    2. Email verification
    3. Documents
    4. Verification
    5. Media manager profile
  4. FLOW 04

    Paid content

    1. Creator
    2. Profile
    3. Publication
    4. Locked state
    5. Access
    6. View
  5. FLOW 05

    Credits

    1. Paid action
    2. Not enough credits
    3. Buy credits
    4. Payment
    5. Back to the action
  6. FLOW 06

    Messaging

    1. Creator profile
    2. Message
    3. Messenger
    4. Free and paid media
  7. FLOW 07

    Live

    1. Creator profile
    2. Private / group live
    3. Price and access
    4. Credits
    5. Session

08 /18

Monetization system

Several revenue models on one virtual currency: users learn the mechanics once and they work everywhere.

Real payment

Credits

  • Content
  • Tips
  • Live
  • Gifts

  • Credits

    The virtual currency behind every paid action.

  • Paid content

    Single publications unlock for a payment.

  • Premium subscription

    Access to a creator's content for paying followers.

  • Tips

    Direct support from a profile, chat or live session.

  • Gifts

    Another way to show support during an interaction.

  • Private live

    A one-to-one session paid in credits.

  • Group live

    A shared session with access paid in credits.

09 /18

UX principles

  1. 01

    Clarity

    Complex monetization should never make basic navigation difficult.

  2. 02

    Consistency

    The same patterns work across profiles, publications, messaging and purchase flows.

  3. 03

    Progressive disclosure

    Advanced functionality appears only when it becomes relevant.

  4. 04

    Trust

    Payments, verification, security and private interactions need explicit states and feedback.

10 /18

Responsive experience

The product holds media-heavy pages, profiles, messaging and monetization flows, so responsive behavior was not simply resizing desktop layouts.

On smaller screens content priority and navigation adapted: what comes first, what moves behind an action, how a paid state stays visible.

  • Media and publications
  • Profiles
  • Messenger
  • Payments and credits
  • Navigation
  • Modal windows

11 /18

System, not screens

The product required a system rather than a collection of isolated screens. Shared components and interaction patterns made complex flows consistent and scalable.

  • Navigation

    • Header and menu
    • Tabs
    • Profile and avatar

  • Content

    • Publication card
    • Locked / premium state
    • Media

  • Communication

    • Messenger
    • Live sessions
    • Chat room

  • Payments

    • Credits and balance
    • Purchase
    • Tips and gifts

  • Feedback

    • Notifications
    • Errors
    • Empty states

12 /18

Brand identity

The logo continues the product work: a mark that lives in the interface, not on a business card.

The product needed a mark that works everywhere: from the full logo on the website to an avatar, a notification and the favicon, in light and dark themes.

The mark is reduced to three simple shapes. Their meanings below are design rationale, not historical fact.

  • Circle

    camera, lens, video, profile

  • Base

    human silhouette, webcam support

  • Dot

    active status, connection, node

Human + Camera + Digital connection

The formula of the mark: a user circle, plus a camera, plus a node dot, equals the Neural WebCam symbol
The concept of the mark

13 /18

Logo development

  1. 01

    Research

    The product, its audience and digital context.

  2. 02

    Keywords

    Human, connection, video, live, digital, network.

  3. 03

    Shape exploration

    Camera, person and network associations reduced to simple geometry.

  4. 04

    Symbol construction

    Circle, base and an independent node.

  5. 05

    Balance

    Ring thickness, dot size, visual centre, bottom curve, spacing.

  6. 06

    Typography

    Rounded lettering complements the soft geometry of the symbol.

  7. 07

    Color

    Blue for digital technology, trust and clarity.

  8. 08

    Responsive testing

    128, 64, 32, 24 and 16 px.

14 /18

Construction

The module X is the diameter of the dot. It sets the proportions of the mark, the clear space (X on every side) and the distance to the wordmark. The logo's proportions were never changed.

Construction: outer and inner circles, axes, the dot as module X and the clear space
Construction grid and clear space

15 /18

Logo variations

Primary, horizontal, symbol only, compact, monochrome, inverse and dark. The symbol is checked from 128 down to 16 px on light, dark and blue backgrounds.

Eight logo versions: primary, horizontal, symbol, compact, monochrome, inverse, dark, horizontal inverse
Logo variations
Palette: signature gradient, primary blue, light blue, navy and paper
Colour
The symbol at 16, 24, 32, 64 and 128 px on white, navy and blue
The mark at small sizes

16 /18

Trust & safety

On an 18+ platform trust is part of the UX: every sensitive step has a clear state and consequence.

  • Age restriction

    An 18+ check before any content.

  • Identity verification

    Documents for creators and media managers.

  • Account security

    Password, sessions, sign-in from a new device.

  • Privacy

    Dedicated confidentiality settings.

  • GDPR and cookies

    Transparent data processing rules.

  • Scam recognition

    Guidance on common schemes.

  • Payment states

    Success, failure, not enough credits.

  • Access restrictions

    Locked content explains how to get access.

17 /18

Developer handoff

The design included developer-ready logic: not just the happy path, but every state the product's behavior depends on.

  • States and variants
  • Responsive behavior
  • Modal logic
  • Access permissions
  • Paid / locked states
  • Error states
  • Empty states
  • Verification states

18 /18

Outcome

A scalable product system combining social interaction, content, live communication and monetization within one interface.

A role-based architecture and reusable interaction patterns allowed the platform to support a large number of scenarios without fragmenting the experience into separate products.

Next case · 03 / 06

Volta — from energy use to clear business decisions

Open case

Tell me briefly about the product and the timeline — I'll reply within a day.

Discuss a project