N444914 ▼ HOME / INDEX ▼ 0201754E
INDEX WORK ABOUT SERVICES PROCESS INSIGHTS CONTACT
UX/UI PRODUCT DESIGNER · WEB APPS · SAAS · MOBILE

IGORSAPONJA.

PRODUCT DESIGN ✦ UX STRATEGY ✦ DESIGN SYSTEMS

I design clear, functional, and scalable digital products by connecting user needs, business goals, and technical realities. My work covers web applications, SaaS platforms, mobile products, dashboards, and design systems.

DOWNLOAD CV
WEB UX/UI SAAS 300 330 000 030 060
LATEST UPDATES

PROFILE OVERVIEW

4 SECTIONS
PROFILE BOARD
ON TIME
SECTION
DATA

SELECTED PRODUCT WORK

PRODUCT DESIGN CASE STUDIES ACROSS WEB, SAAS, MOBILE AND COMPLEX WORKFLOWS

CASE-01 NDA
Enterprise CRM platform dashboard
B2B CRM · ENTERPRISE SAAS

ENTERPRISE CRM PLATFORM

A connected CRM product covering client management, campaigns, documents and complex operational workflows.

CASE-02 PUBLIC
Effortless Living responsive website redesign
WEB UX/UI · RESPONSIVE WEBSITE

EFFORTLESS LIVING WEBSITE REDESIGN

A complete responsive redesign that transformed a limited website into a clearer and more complete digital experience.

CASE-03 NDA
FitTrackr health and fitness mobile dashboard
MOBILE UX/UI · HEALTH & FITNESS

FITTRACKR MOBILE APP

A mobile product connecting onboarding, workouts, meal planning, subscriptions and daily progress.

CASE-04 NDA
Client Operations Dashboard interface
B2B SAAS · OPERATIONS DASHBOARD

CLIENT OPERATIONS DASHBOARD

A dashboard product connecting account information, subscriptions, settings and recurring operational tasks.

FEATURED DESIGN WORK

SELECTED WORK SAMPLES ACROSS DESIGN CATEGORIES

CARD-001
PORTFOLIO / 001
BUSINESS CARD2024
Executive Business Cards
Premium business card design with embossed details and spot UV finish. Corporate identity aligned across digital and print.

PRODUCT DESIGN SERVICES

CAPABILITIES FOR DIGITAL PRODUCTS, PLATFORMS & EXPERIENCES

SERVICE-01
PRODUCT DESIGN
End-to-end product thinking
  • ✓Product discovery and definition
  • ✓User flows and UX architecture
  • ✓Wireframes and interface design
  • ✓Interactive prototypes
  • ✓Developer-ready handoff
SERVICE-02
WEB & SAAS UX/UI
Clear interfaces for complex products
  • ✓Web apps and SaaS platforms
  • ✓Dashboards and admin systems
  • ✓Responsive website design
  • ✓UX audits and redesigns
  • ✓Conversion-focused improvements
SERVICE-03
MOBILE PRODUCT DESIGN
Focused experiences for iOS and Android
  • ✓Mobile app UX and UI
  • ✓Onboarding and activation flows
  • ✓Feature and navigation design
  • ✓Responsive interaction patterns
  • ✓Clickable product prototypes
SERVICE-04
BRAND & VISUAL DESIGN
Clear visual systems for products and businesses
  • ✓Logo and brand identity design
  • ✓Visual direction and brand systems
  • ✓Brochures, presentations and print
  • ✓Marketing and campaign assets
  • ✓Custom illustration

Every engagement is scoped around the product, users, business goals, and technical requirements.
Project structure and deliverables are agreed before work begins.

WHAT I BRING TO A PRODUCT TEAM

PRODUCT THINKING, OWNERSHIP & STRUCTURED COLLABORATION

VALUE-01
PRODUCT THINKING
Connecting user needs, business goals and technical realities to create purposeful product decisions.
VALUE-02
END-TO-END OWNERSHIP
Taking work from discovery and UX architecture through interface design, prototyping and developer handoff.
VALUE-03
CROSS-FUNCTIONAL COLLABORATION
Working closely with product managers, analysts, developers, QA and stakeholders throughout delivery.
VALUE-04
STRUCTURED EXECUTION
Clear decisions, organised documentation and scalable design foundations that support implementation.

HOW WE CAN WORK TOGETHER

ENGAGEMENT OPTIONS & COMMUNICATION PROTOCOLS

COM-01
PROJECT INQUIRY
Interested in working together on a design project
→ Response within 24 hours
COM-02
CONSULTATION
Schedule a call to discuss your design needs
→ Book a 30-minute discovery call
COM-03
SPEAKING & WORKSHOPS
Invite me to speak about systematic design thinking
→ Always happy for events and workshops
COM-04
GENERAL CONTACT
Questions, feedback, or just want to connect
→ Always happy to hear from you

FREQUENTLY ASKED QUESTIONS

PROJECT & COLLABORATION FAQ

Yes. I regularly work with confidential product work and can operate under an NDA. Public portfolio material is shown only where disclosure is permitted.

Timing depends on scope, complexity and the level of research or validation required. Smaller focused engagements can take a few weeks, while broader product work may run across multiple phases.

Yes. Projects can be handled remotely across different locations and time zones, including EU, UK and US collaboration, with communication and review points agreed at the start of the engagement.

We begin by clarifying the product challenge, goals, scope and available context. From there I define the appropriate design phases, deliverables and review points before detailed work begins.

Yes. Collaboration can be structured as a defined project or as ongoing design support, depending on the product, team and amount of design work required.

Pricing is agreed after the scope is clear. Depending on the engagement, work can be structured around a defined project scope, an hourly arrangement or ongoing support.

HAVE A PRODUCT OR DESIGN CHALLENGE?
LET'S TURN IT INTO A CLEAR, WORKABLE PRODUCT

Tell me what you are building, improving, or trying to understand. I will help define the right design scope and a practical path forward.

PROC/01

PRODUCT DESIGN PROCESS

A FLEXIBLE END-TO-END APPROACH FOR DIGITAL PRODUCTS
01
Discovery & Research
UNDERSTAND
02
Strategy & Structure
DEFINE
03
UX & UI Design
DESIGN
04
Prototyping
SIMULATE
05
Validation & Iteration
REFINE
06
Handoff & Support
DELIVER
SCOPE
PROJECT-BASED
PHASES
6 STAGES
APPROACH
COLLABORATIVE
METHODOLOGY
HUMAN-CENTERED

PROCESS PHASES

CLICK ANY PHASE TO EXPAND — ADAPTED TO THE PRODUCT, TEAM AND SCOPE

01
Discovery & Research
Understanding users, goals and product context
SCOPE-BASED

I begin by clarifying the product challenge, business goals, user needs and technical context. The depth of research is adapted to the available evidence, project stage and scope.

Stakeholder Alignment
Clarify objectives, constraints, priorities and success criteria with the people responsible for the product.
User & Workflow Review
Examine user needs, current journeys, pain points and operational processes relevant to the design challenge.
Existing Product Analysis
Review available screens, analytics, feedback and documentation to identify friction and opportunities.
Market & Reference Review
Study relevant products and interaction patterns without copying competitor solutions.
POSSIBLE OUTPUTS
Discovery Notes Problem Definition User & Workflow Insights Design Priorities
02
Strategy & Product Structure
Defining flows, hierarchy and solution direction
SCOPE-BASED

Research and requirements are translated into a clear product structure. I define how information, features and user actions should connect before detailed visual design begins.

Information Architecture
Organise content, modules and navigation around user priorities and product logic.
User Flows
Map key journeys, decisions, dependencies and alternate states across the experience.
Wireframes
Explore page structure and interaction logic before visual detail increases the cost of change.
Solution Review
Review the proposed direction with product, business and technical stakeholders before moving forward.
POSSIBLE OUTPUTS
Information Architecture User Flows Wireframes Product Structure
03
UX & UI Design
Turning product structure into a clear interface
SCOPE-BASED

The approved structure is developed into a clear, consistent and responsive interface. Visual decisions support usability, hierarchy, brand direction and the technical requirements of the product.

Visual Direction
Define typography, colour, spacing and interface character appropriate for the product and its users.
High-Fidelity Interface Design
Create detailed screens for the agreed user flows, platforms and responsive breakpoints.
Reusable UI Patterns
Build consistent components, states and behaviours that can scale with the product.
Accessibility Considerations
Apply readable hierarchy, contrast, interaction clarity and accessible patterns throughout the design.
POSSIBLE OUTPUTS
High-Fidelity Screens Responsive Designs Reusable Components UI Guidance
04
Prototyping
Testing flows, states and interaction behaviour
SCOPE-BASED

Interactive prototypes make flows and behaviour easier to evaluate before development. The level of fidelity depends on what needs to be reviewed, validated or communicated.

Clickable Prototypes
Connect key screens and actions to simulate realistic product journeys.
Interaction Behaviour
Define important transitions, feedback and state changes where they improve clarity.
States & Edge Cases
Include relevant empty, loading, error, success and permission states.
Team Review
Review flows with product, business and technical stakeholders before further validation or implementation.
POSSIBLE OUTPUTS
Interactive Prototype Interaction Notes State Coverage Review Feedback
05
Validation & Iteration
Reviewing evidence and improving the solution
SCOPE-BASED

The design is reviewed against user needs, business goals and product requirements. Validation methods are selected according to the available users, evidence, timeline and level of risk.

Usability Review
Observe how users or stakeholders understand and complete important tasks within the proposed experience.
Heuristic Evaluation
Review usability, consistency, feedback and interaction clarity across key flows.
Feedback Analysis
Group findings by impact, frequency and implementation priority.
Iteration & Refinement
Improve flows, content, hierarchy and interface details based on the strongest available evidence.
POSSIBLE OUTPUTS
Review Findings Prioritised Issues Updated Designs Refined Prototype
06
Handoff & Product Support
Preparing the design for implementation
SCOPE-BASED

Approved designs are organised and documented so developers can understand the intended structure, states and behaviour. I remain available during implementation when clarification or design review is needed.

Design File Preparation
Organise approved screens, components, states and flows into a clear implementation-ready structure.
Interaction & Behaviour Notes
Document important responsive rules, states, transitions and edge cases.
Developer Collaboration
Answer implementation questions and clarify design intent as development progresses.
Design Review
Compare implemented work with the approved design and identify meaningful inconsistencies where review is included in scope.
POSSIBLE OUTPUTS
Organised Design Files Component Guidance Interaction Notes Design Review Feedback

DESIGN PRINCIPLES

STANDARDS THAT GUIDE THE WORK

1
USER & BUSINESS CONTEXT
Decisions are based on the strongest available understanding of users, product goals and operational needs.
2
ACCESSIBLE THINKING
Readability, contrast, hierarchy and interaction clarity are considered throughout the design process.
3
RESPONSIVE BY DESIGN
Layout and interaction behaviour are considered across relevant screen sizes from the start.
4
CONSISTENT PATTERNS
Reusable components and predictable behaviours help the product remain coherent as it grows.

COLLABORATION

HOW THE TEAM STAYS ALIGNED

1
CLEAR EXPECTATIONS
Scope, priorities, responsibilities and decision-makers are clarified before detailed work begins.
2
REGULAR REVIEWS
Progress and open questions are reviewed at intervals appropriate to the project and team.
3
DOCUMENTED DECISIONS
Important feedback, requirements and agreed changes are recorded to reduce ambiguity.
4
CROSS-FUNCTIONAL INPUT
Product, business, development and QA perspectives are included when they affect the solution.

DESIGN TOOLS

PRIMARY WORKING TOOLKIT

FIGMA
UX/UI Design · Components · Prototyping
MIRO
Workshops · Flows · Product Mapping
AI TOOLS
Research Support · Exploration · Workflow Efficiency
PROCREATE
Sketching · Concepts · Visual Exploration
AFFINITY DESIGNER
Vector Design · Layouts · Visual Assets
ADOBE ILLUSTRATOR
Vector Graphics · Icons · Visual Assets
HAVE A PRODUCT OR DESIGN CHALLENGE?
LET'S TURN THE PROCESS INTO REAL PRODUCT PROGRESS

Every project needs a clear direction, the right level of structure and a process that fits the team. Let’s define what matters and move the product forward.

Igor Saponja
AVAILABLE FOR SELECTED PROJECTS
ABOUT
PRODUCT DESIGN · UX/UI · DIGITAL EXPERIENCES

IGOR SAPONJA

UX/UI Product Designer · End-to-End Product Design

I design clear, functional and scalable digital products across web, SaaS and mobile. My work connects user needs, business goals and technical realities—from early product structure and user flows to polished interfaces, prototypes and developer handoff.

Before moving into design, I built a long career in aviation and operational planning. That background shaped how I approach complex systems: with structure, attention to detail, clear communication and respect for the people using them.

PERSONAL MARK
PERSONAL
IDENTITY MARK
6,000+
DESIGN HOURS
50+
PROJECTS
4+ YEARS
PRODUCT DESIGN
WEB · SAAS · MOBILE
PRODUCT TYPES
EU · UK · US
MARKETS

DESIGN EXPERIENCE

CLICK ANY ROLE TO EXPAND — SELECTED PROFESSIONAL EXPERIENCE

01
Lead Product Designer @ Kiwistic
Jan 2023 – Present · Remote · Digital Products & Services
Lead · Co-founder
CURRENT
KEY RESPONSIBILITIES
  • Lead UX/UI and product design across web, SaaS, platform and mobile projects
  • Translate business requirements into product structure, user flows and interface solutions
  • Own projects from early discovery and wireframes through visual design, prototypes and handoff
  • Collaborate with product managers, developers, QA and client stakeholders throughout delivery
CORE AREAS
Product Design UX/UI Figma Prototyping Design Handoff
02
UI/UX Designer @ eCore Services
Oct 2021 – Mar 2025 · Remote · Digital Product Design
Product Design
3+ YEARS
KEY RESPONSIBILITIES
  • Designed responsive web applications, SaaS products, dashboards and mobile experiences
  • Developed user flows, wireframes, high-fidelity interfaces and clickable prototypes
  • Worked from initial product requirements and refined solutions through regular team reviews
  • Prepared organised design files and implementation guidance for development teams
CORE AREAS
Web Apps SaaS Dashboards Mobile Figma
03
UI Designer @ Crowdbotics
Jan 2022 – Jan 2024 · Contract · US Product Teams
UI Design
2 YEARS
KEY RESPONSIBILITIES
  • Created polished interfaces for client-facing web and mobile product projects
  • Translated product requirements and approved wireframes into consistent visual systems
  • Designed responsive screens, components and interface states for implementation
  • Worked within distributed product teams and structured review processes
CORE AREAS
UI Design Web Mobile Components Responsive Design
04
Freelance Graphic Designer @ Independent
Earlier Career · Remote · Brand & Visual Design
Freelance
VISUAL DESIGN
KEY RESPONSIBILITIES
  • Delivered visual design work for clients across different markets and business types
  • Created logos, brand identities, marketing materials, illustrations and digital assets
  • Managed client communication, feedback, revisions and final production delivery
  • Developed practical experience connecting design quality with real business needs
CORE AREAS
Brand Identity Graphic Design Illustration Adobe Client Work
PROFESSIONAL FOCUS
WHERE I CREATE THE MOST VALUE
End-to-End Product Design
From product structure and user flows to final UI and handoff
01
Complex Product Simplification
Making dense workflows, dashboards and systems easier to understand
02
Scalable Interface Systems
Reusable components, consistent patterns and responsive behaviour
03
Cross-Functional Delivery
Clear collaboration with product, development, QA and stakeholders
04
CAPABILITIES & TOOLKIT
TOOLS · METHODS · PRODUCT SKILLS
DESIGN TOOLS
Figma Miro Affinity Procreate Adobe Illustrator
PRODUCT DESIGN
Information Architecture User Flows Wireframing Prototyping Responsive UX/UI
SYSTEMS & DELIVERY
Design Systems Reusable Components Interaction States Design Handoff Design QA
COLLABORATION
Stakeholder Alignment Product Thinking Cross-functional Work Client Communication Structured Reviews
TECHNICAL AWARENESS
HTML / CSS Responsive Behaviour Accessibility Considerations Implementation Constraints
DESIGN PHILOSOPHY
HOW I APPROACH PRODUCT DESIGN

Good product design brings clarity to complex problems. I focus on understanding what users need, what the business is trying to achieve and what the team can realistically build. The strongest solution is not always the most visually elaborate one—it is the one that works clearly and consistently.

My earlier aviation and operational planning experience strengthened my attention to systems, dependencies and communication. I apply that discipline without turning every project into a rigid process.

PRINCIPLES THAT GUIDE MY WORK
  • Context before solutions — understand the problem, users and constraints first
  • Clarity over decoration — visual decisions should improve understanding and action
  • Systems over isolated screens — patterns should remain consistent as the product grows
  • Collaboration through delivery — design remains connected to product and implementation
SPECIALISATIONS
CORE AREAS OF DESIGN WORK
  • 01
    Web Applications & SaaS Products
  • 02
    Mobile Product Design
  • 03
    Dashboards & Complex Workflows
  • 04
    Responsive UI & Design Systems
  • 05
    Brand & Visual Design

INDUSTRY & PRODUCT CONTEXTS

SELECTED AREAS ACROSS CLIENT, CONTRACT AND IN-HOUSE WORK

Enterprise SaaS
CRM & Operations
Health & Fitness
E-Commerce
Real Estate & Property
Professional Services
Aviation Operations
Consumer Platforms
HAVE A PRODUCT OR DESIGN CHALLENGE?
LET'S CREATE A CLEARER PATH FORWARD

Share what you are building, improving or trying to understand. I can help define the right design scope and turn complexity into a clear, practical product direction.

SELECTED PRODUCT WORK

PRODUCT DESIGN CASE STUDIES ACROSS WEB, SAAS, MOBILE AND COMPLEX WORKFLOWS

CASE-01 NDA
Enterprise CRM platform dashboard
B2B CRM · ENTERPRISE SAAS

ENTERPRISE CRM PLATFORM

A connected CRM product covering client management, campaigns, documents and complex operational workflows.

1–3 MOS HIGH COMPLEXITY
CASE-02 PUBLIC
Effortless Living responsive website redesign
WEB UX/UI · RESPONSIVE WEBSITE

EFFORTLESS LIVING WEBSITE REDESIGN

A complete responsive redesign that transformed a limited website into a clearer and more complete digital experience.

1 MO MED COMPLEXITY
CASE-03 NDA
FitTrackr health and fitness mobile dashboard
MOBILE UX/UI · HEALTH & FITNESS

FITTRACKR MOBILE APP

A mobile product connecting onboarding, workouts, meal planning, subscriptions and daily progress.

3 MOS HIGH COMPLEXITY
CASE-04 NDA
Client Operations Dashboard interface
B2B SAAS · OPERATIONS DASHBOARD

CLIENT OPERATIONS DASHBOARD

A dashboard product connecting account information, subscriptions, settings and recurring operational tasks.

DURATION NDA HIGH COMPLEXITY

VISUAL & BRAND DESIGN

SELECTED IDENTITY, PRINT, ILLUSTRATION AND VISUAL COMMUNICATION WORK

Kiwistic logo mockup LOGO / 01
LOGO DESIGN
KIWISTIC BRAND MARK
Logo identity for a digital Design and WordPress studio focused on clear, functional and user-centered digital experiences.
VINS Agency logo mockup LOGO / 02
LOGO DESIGN
VINS AGENCY LOGO MARK
Logo identity for a business support agency focused on vehicle registration, insurance and administrative services.
Bona Fides logo mockup LOGO / 03
LOGO DESIGN
BONA FIDES BRAND MARK
Logo identity for a vehicle inspection center offering registration, insurance and convenient vehicle pickup and return services.
Community Health and Wellness logo mockup LOGO / 04
LOGO DESIGN
COMMUNITY HEALTH & WELLNESS BRAND MARK
Logo identity for a community health and wellness service focused on accessible, supportive care and everyday wellbeing.
Dynamic NFT Solution logo mockup LOGO / 05
LOGO DESIGN
DYNAMIC NFT SOLUTION BRAND MARK
Logo identity for an NFT solution focused on Web3 projects and digital ownership experiences.
Matcha Cafe and Tea logo mockup LOGO / 06
LOGO DESIGN
MATCHA CAFE & TEA BRAND MARK
Logo identity for a matcha-focused cafe and tea shop built around a calm, modern and natural brand experience.
Pot Studio logo mockup LOGO / 07
LOGO DESIGN
POT STUDIO BRAND MARK
Logo identity for a pottery studio focused on handcrafted ceramics, creative workshops and a warm, tactile brand experience.
Saxona logo mockup LOGO / 08
LOGO DESIGN
SAXONA BRAND MARK
Logo identity for a laser cutting studio focused on precision fabrication, custom pieces and crafted production.
Sourdough Bakery logo mockup LOGO / 09
LOGO DESIGN
SOURDOUGH BAKERY BRAND MARK
Logo identity for an artisan bakery focused on naturally fermented bread, handcrafted products and a warm local brand feel.
South Specialty Coffee logo mockup LOGO / 10
LOGO DESIGN
SOUTH SPECIALTY COFFEE BRAND MARK
Logo identity for a specialty coffee brand focused on quality coffee, contemporary cafe culture and a refined everyday experience.
Summer Breeze Beach Hotel logo mockup LOGO / 11
LOGO DESIGN
SUMMER BREEZE BEACH HOTEL BRAND MARK
Logo identity for a coastal boutique hotel focused on relaxed stays, modern hospitality and a light seaside atmosphere.
CHUG Kombucha logo mockup LOGO / 12
LOGO DESIGN
CHUG KOMBUCHA BRAND MARK
Logo design for a modern kombucha brand, created with a bold, playful and distinctive visual character.
Mooch Coati logo mockup LOGO / 13
LOGO DESIGN
MOOCH COATI BRAND MARK
Logo design for a playful cookie brand, built around a bold character-led identity with a memorable and approachable visual presence.
Ada Bridge Belgrade illustration ILLUSTRATION / 01
ILLUSTRATION
ADA BRIDGE — BELGRADE
Architectural illustration of Belgrade’s Ada Bridge, focused on its distinctive structure and contemporary city landmark presence.
Air Force Museum Belgrade Airport illustration ILLUSTRATION / 02
ILLUSTRATION
AIR FORCE MUSEUM — BELGRADE AIRPORT
Architectural illustration of the Aviation Museum near Belgrade Airport, highlighting its distinctive circular form and aviation heritage.
Old Train Station Belgrade illustration ILLUSTRATION / 03
ILLUSTRATION
OLD TRAIN STATION — BELGRADE
Architectural illustration of Belgrade’s historic railway station, capturing its classical facade and role in the city’s urban heritage.
Belgrade University Building illustration ILLUSTRATION / 04
ILLUSTRATION
BELGRADE UNIVERSITY BUILDING
Architectural illustration of a historic Belgrade university building, highlighting its classical facade and academic character.
Elegant Belgrade City illustration ILLUSTRATION / 05
ILLUSTRATION
ELEGANT BELGRADE CITY
City illustration capturing Belgrade’s architectural character through a refined, stylized urban composition.
Genex Towers Belgrade illustration ILLUSTRATION / 06
ILLUSTRATION
GENEX TOWERS — BELGRADE
Architectural illustration of Belgrade’s iconic Genex Towers, highlighting their bold brutalist form and recognizable city silhouette.
Hotel Moscow Belgrade illustration ILLUSTRATION / 07
ILLUSTRATION
HOTEL MOSCOW — BELGRADE
Architectural illustration of Belgrade’s historic Hotel Moscow, highlighting its distinctive facade and elegant city-center presence.
Museum of Contemporary Art New Belgrade illustration ILLUSTRATION / 08
ILLUSTRATION
MUSEUM OF CONTEMPORARY ART — NEW BELGRADE
Architectural illustration of Belgrade’s Museum of Contemporary Art, highlighting its geometric form and modernist character.
National Museum Belgrade illustration ILLUSTRATION / 09
ILLUSTRATION
NATIONAL MUSEUM — BELGRADE
Architectural illustration of the National Museum in Belgrade, highlighting its historic facade and prominent city-center presence.
Nikola Tesla Museum Belgrade illustration ILLUSTRATION / 10
ILLUSTRATION
NIKOLA TESLA MUSEUM — BELGRADE
Architectural illustration of the Nikola Tesla Museum in Belgrade, highlighting its historic setting and cultural significance.
Presidential Palace Belgrade illustration ILLUSTRATION / 11
ILLUSTRATION
PRESIDENTIAL PALACE — BELGRADE
Architectural illustration of Belgrade’s Presidential Palace, highlighting its formal facade and prominent civic character.
Prince Mihailo Monument Belgrade illustration ILLUSTRATION / 12
ILLUSTRATION
PRINCE MIHAILO MONUMENT — BELGRADE
Illustration of Belgrade’s Prince Mihailo Monument, capturing its historic character and iconic presence in Republic Square.
Victor Monument Belgrade illustration ILLUSTRATION / 13
ILLUSTRATION
VICTOR MONUMENT — BELGRADE
Illustration of Belgrade’s Victor Monument, highlighting its iconic silhouette and landmark position above the city.
Welcome to Belgrade illustration ILLUSTRATION / 14
ILLUSTRATION
WELCOME TO BELGRADE
City illustration celebrating Belgrade through a welcoming composition of recognizable urban landmarks and local character.
Bona Fides brand identity mockup BRAND / 01
BRAND IDENTITY
BONA FIDES BRAND IDENTITY
Brand identity for a vehicle inspection center, built around trust, clarity and a practical service experience.
CHUG Kombucha brand identity mockup BRAND / 02
BRAND IDENTITY
CHUG KOMBUCHA BRAND IDENTITY
Brand identity for a modern kombucha brand focused on bold character, natural ingredients and a fresh contemporary feel.
Community Health and Wellness brand identity mockup BRAND / 03
BRAND IDENTITY
COMMUNITY HEALTH & WELLNESS BRAND IDENTITY
Brand identity for a community health and wellness service, designed to feel approachable, supportive and trustworthy.
Dynamic NFT Solutions brand identity mockup BRAND / 04
BRAND IDENTITY
DYNAMIC NFT SOLUTIONS BRAND IDENTITY
Brand identity for an NFT and Web3 solution focused on digital ownership and modern decentralized experiences.
Kiwistic brand identity mockup BRAND / 05
BRAND IDENTITY
KIWISTIC BRAND IDENTITY
Brand identity for a digital Design and WordPress studio, combining a clear visual system with a modern, functional creative direction.
Kiwistic brand identity mockup BRAND / 06
BRAND IDENTITY
MATCHA CAFE & TEA BRAND IDENTITY
Brand identity for a matcha-focused cafe and tea shop, combining a calm visual system with a fresh, natural and contemporary character.
Kiwistic brand identity mockup BRAND / 07
BRAND IDENTITY
MOOCH COATI BRAND IDENTITY
Brand identity for a playful cookie brand built around bold packaging, character-led visuals and a distinctive, cheeky personality.
Kiwistic brand identity mockup BRAND / 08
BRAND IDENTITY
POT STUDIO BRAND IDENTITY
Brand identity for a contemporary pottery studio, combining a warm tactile aesthetic with a simple, modern and handcrafted visual direction.
Kiwistic brand identity mockup BRAND / 09
BRAND IDENTITY
SIGIL BREWERY BRAND IDENTITY
Brand identity for an independent brewery, combining a distinctive symbol system with a bold, crafted and contemporary visual character.
Kiwistic brand identity mockup BRAND / 10
BRAND IDENTITY
SOURDOUGH BAKERY BRAND IDENTITY
Brand identity for an artisan sourdough bakery, combining a warm handcrafted feel with a simple, contemporary and approachable visual system.
Kiwistic brand identity mockup BRAND / 11
BRAND IDENTITY
SOUTH SPECIALTY COFFEE BRAND IDENTITY
Brand identity for a specialty coffee brand, combining a refined contemporary look with a warm, distinctive and craft-focused visual system.
Kiwistic brand identity mockup BRAND / 12
BRAND IDENTITY
VINS AGENCY BRAND IDENTITY
Brand identity for a business support agency focused on vehicle registration, insurance and administrative services, built around clarity, reliability and an efficient visual system.
Community Health and Wellness flyer mockup FLYER / 01
BROCHURES
COMMUNITY HEALTH & WELLNESS FLYER
Flyer design for a community health and wellness service, created to present key information in a clear, approachable and easy-to-scan format.
Enterprise Training Solutions brochure mockup BROCHURE / 01
BROCHURES
ENTERPRISE TRAINING SOLUTIONS
Brochure design for a professional training provider, created to present services, programs and key information through a clear and structured visual hierarchy.
Matcha Cafe and Tea flyer mockup FLYER / 02
BROCHURES
MATCHA CAFE & TEA FLYER
Flyer design for a matcha-focused cafe and tea shop, created to communicate the offer through a calm, fresh and easy-to-scan visual layout.
Mooch Coati flyer mockup FLYER / 03
BROCHURES
MOOCH COATI FLYER
Flyer design for a playful cookie brand, using bold visual hierarchy and character-led branding to create a fun, memorable promotional piece.
Neo Connect brochure mockup BROCHURE / 02
BROCHURES
NEO CONNECT
Brochure design for a connectivity-focused business, created to present services and key information through a clear, professional and structured visual system.
Pot Studio flyer mockup FLYER / 04
BROCHURES
POT STUDIO FLYER
Flyer design for a contemporary pottery studio, combining a warm handcrafted feel with a clean, modern and easy-to-read promotional layout.
Sourdough Bakery flyer mockup FLYER / 05
BROCHURES
SOURDOUGH BAKERY FLYER
Flyer design for an artisan sourdough bakery, combining a warm handcrafted character with a clean and approachable promotional layout.
South Specialty Coffee flyer mockup FLYER / 06
BROCHURES
SOUTH SPECIALTY COFFEE FLYER
Flyer design for a specialty coffee brand, combining a refined visual style with a clear, modern and inviting promotional layout.
Summer Breeze Beach Hotel flyer mockup FLYER / 07
BROCHURES
SUMMER BREEZE BEACH HOTEL FLYER
Flyer design for a beach hotel, combining a relaxed hospitality feel with a clean, inviting and easy-to-scan promotional layout.
Chug Kombucha packaging mockup PACK / 01
PACKAGING
CHUG KOMBUCHA PACKAGING
Packaging design for a modern kombucha brand, using bold visual character and a fresh, contemporary system across the product range.
Matcha Cafe and Tea packaging mockup PACK / 02
PACKAGING
MATCHA CAFE & TEA PACKAGING
Packaging design for a matcha-focused cafe and tea brand, combining a calm natural aesthetic with a clean, modern and premium product presentation.
Mooch Coati packaging mockup PACK / 03
PACKAGING
MOOCH COATI PACKAGING
Packaging design for a playful cookie brand, combining bold character-led graphics with a distinctive, memorable and shelf-ready visual system.
Pot Studio packaging mockup PACK / 04
PACKAGING
POT STUDIO PACKAGING
Packaging design for a contemporary pottery studio, combining a tactile handcrafted feel with a clean, modern and distinctive product presentation.
Rakija Homemade Bourbon packaging mockup PACK / 05
PACKAGING
RAKIJA HOMEMADE BOURBON PACKAGING
Packaging design for a handcrafted rakija and bourbon concept, combining a traditional product character with a refined, distinctive and contemporary presentation.
Sigil Brewery packaging mockup PACK / 06
PACKAGING
SIGIL BREWERY PACKAGING
Packaging design for an independent brewery, combining a bold symbol-led identity with a crafted, distinctive and contemporary product presentation.
Sourdough Bakery packaging mockup PACK / 07
PACKAGING
SOURDOUGH BAKERY PACKAGING
Packaging design for an artisan sourdough bakery, combining a warm handcrafted character with a clean, distinctive and contemporary product presentation.
South Specialty Coffee packaging mockup PACK / 08
PACKAGING
SOUTH SPECIALTY COFFEE PACKAGING
Packaging design for a specialty coffee brand, combining a refined visual identity with a clean, premium and contemporary product presentation.
HAVE A PRODUCT OR DESIGN CHALLENGE?
LET'S CREATE A CLEARER PATH FORWARD

Share what you are building, improving or trying to understand. I will help define the right design scope and a practical path forward.

PRODUCT DESIGN SERVICES

FLEXIBLE DESIGN SUPPORT FOR DIGITAL PRODUCTS, PLATFORMS AND BRANDS

SERVICE-01
PRODUCT DESIGN
End-to-end product thinking
  • ✓Product discovery and definition
  • ✓Information architecture and user flows
  • ✓Wireframes and interface structure
  • ✓High-fidelity UX/UI design
  • ✓Clickable prototypes
  • ✓Developer-ready handoff
BEST FOR
New products, feature definition, redesigns and complex digital workflows.
SERVICE-02
WEB & SAAS UX/UI
Clear systems for complex products
  • ✓SaaS platforms and web applications
  • ✓Dashboards and admin interfaces
  • ✓Responsive website experiences
  • ✓Complex workflows and product states
  • ✓Reusable interface components
  • ✓Responsive design documentation
BEST FOR
SaaS companies, platforms and teams simplifying complex web products.
SERVICE-03
MOBILE PRODUCT DESIGN
Focused experiences for iOS and Android
  • ✓Mobile application UX and UI
  • ✓Onboarding and activation flows
  • ✓Navigation and feature design
  • ✓Account, subscription and payment flows
  • ✓Interaction states and edge cases
  • ✓Clickable product prototypes
BEST FOR
Mobile products, new features and existing apps that need clearer UX.
SERVICE-04
BRAND & VISUAL DESIGN
Visual systems that support the product
  • ✓Logo and visual identity design
  • ✓Brand direction and design language
  • ✓Marketing and campaign assets
  • ✓Illustrations and visual concepts
  • ✓Presentation and sales materials
  • ✓Digital and print-ready delivery
BEST FOR
Products and businesses needing a clear, consistent visual identity.

Every engagement is shaped around the product, users, business goals and technical requirements.
Scope, deliverables and collaboration are agreed before work begins.

ENGAGEMENT MODELS

FLEXIBLE WAYS TO STRUCTURE THE WORK

ENG-01
FOCUSED PROJECT
SCOPE-BASED
A defined design challenge, feature, flow or visual system with a clear objective and agreed output.
MAY INCLUDE
  • Focused discovery
  • User flows or wireframes
  • High-fidelity UX/UI
  • Prototype or handoff
ENG-02
END-TO-END PRODUCT ENGAGEMENT
PROJECT-BASED
A broader engagement covering product structure, UX, UI, prototyping and implementation-ready delivery.
MAY INCLUDE
  • Discovery and definition
  • Information architecture
  • Responsive product design
  • Components and handoff
ENG-03
ONGOING DESIGN SUPPORT
FLEXIBLE COLLABORATION
Continued design support for evolving products, new features, interface improvements and design-system consistency.
MAY INCLUDE
  • Feature and flow design
  • UX/UI improvements
  • Component expansion
  • Design review and support

DESIGN PROCESS OVERVIEW

A FLEXIBLE APPROACH ADAPTED TO THE PRODUCT, TEAM AND SCOPE

P-01
UNDERSTAND
Clarify the product context, user needs, business goals and relevant constraints.
P-02
DEFINE
Structure priorities, information architecture, user flows and solution direction.
P-03
DESIGN & PROTOTYPE
Create clear interfaces, reusable patterns and prototypes for important flows.
P-04
REFINE & DELIVER
Review the solution, refine important details and prepare it for implementation.
NEED DESIGN SUPPORT FOR YOUR PRODUCT?
LET'S DEFINE THE RIGHT SCOPE TOGETHER

Share the product, challenge or opportunity you are working on. We can clarify the priorities, complexity and most useful way to collaborate.

CS/001
TechCorp Industries — CASE STUDY

Enterprise CRM Platform

Sole Product Designer · Enterprise SaaS · End-to-end UX/UI
PROJECT TYPE
MOBL UXD
DURATION
12 WKS
COMPLEXITY
HIGH
STATUS
COMPLETED
ROLE
SOLE PRODUCT DESIGNER
PROJECT BRIEF
THE BUSINESS CHALLENGE

The project focused on a complex enterprise CRM platform connecting client management, proposals, contracts, onboarding, campaigns, documents, reporting and internal operations within one product.

MY ROLE

I worked as the sole Product Designer within a cross-functional team that included a Project Manager, Business Analyst, Customer Success Manager, developers and QA. After receiving the initial PRD, I independently owned the UX structure, information architecture, user flows, wireframes, UI system, high-fidelity screens, prototypes, weekly client reviews and development handoff.

NDA NOTE

Client names, brand elements, internal business data, protected workflows and identifying details have been removed or anonymised.

OBJECTIVES
SUCCESS CRITERIA
  • ✓Create a clear structure across connected CRM modules
  • ✓Make dense business data easier to scan and manage
  • ✓Standardise tables, forms, statuses and actions
  • ✓Support proposals, contracts, onboarding and campaigns
  • ✓Build reusable UI patterns for future product growth
  • ✓Deliver client-approved designs ready for development
DESIGN PROCESS & METHODOLOGY
FROM INITIAL PRD TO CLIENT APPROVAL AND DEVELOPMENT HANDOFF
REQUIREMENTS ANALYSIS
PH-01
INITIAL PHASE
WHAT I DID

Reviewed the initial PRD and translated business requirements into product modules, workflows and open design questions.

WHY IT MATTERED

The CRM connected many business processes. A clear understanding of dependencies was necessary before designing individual screens.

KEY DECISION

Treat the platform as one connected system rather than a collection of isolated features.

DELIVERABLES
Requirement notes Module map Open questions
INFORMATION ARCHITECTURE & USER FLOWS
PH-02
EARLY PHASE
WHAT I DID

Defined navigation, module relationships and end-to-end flows across clients, proposals, contracts, onboarding and campaigns.

WHY IT MATTERED

Users needed to move between related records without losing context or repeatedly searching for the same information.

KEY DECISION

Use consistent overview-to-detail patterns throughout the product.

DELIVERABLES
Information architecture User flows Navigation logic
WIREFRAMES & INTERACTION LOGIC
PH-03
ITERATIVE
WHAT I DID

Created wireframes for dashboards, tables, record details, forms, documents and operational workflows.

WHY IT MATTERED

Low-fidelity structure allowed complex logic to be reviewed before visual detail increased the cost of change.

KEY DECISION

Prioritise scannability and predictable actions in data-heavy views.

DELIVERABLES
Wireframes Page structures Interaction logic
HIGH-FIDELITY UI & COMPONENT SYSTEM
PH-04
DESIGN PHASE
WHAT I DID

Designed the final interface and reusable patterns for tables, filters, statuses, forms, documents and actions.

WHY IT MATTERED

A shared component system reduced inconsistency and supported additional modules without redesigning the product.

KEY DECISION

Create repeatable system-level patterns instead of screen-specific solutions.

DELIVERABLES
High-fidelity UI Reusable components UI patterns
WEEKLY CLIENT REVIEWS & REVISIONS
PH-05
ONGOING
WHAT I DID

Presented progress weekly, clarified requirements and incorporated approved revisions across the platform.

WHY IT MATTERED

Regular feedback prevented late-stage surprises and kept product decisions aligned with client expectations.

KEY DECISION

Validate modules continuously rather than waiting for one final review.

DELIVERABLES
Review presentations Revision rounds Client approval
FINAL APPROVAL & DEVELOPMENT HANDOFF
PH-06
FINAL PHASE
WHAT I DID

Prepared approved screens, prototypes, component guidance and implementation details for the development team.

WHY IT MATTERED

Clear handoff reduced ambiguity and helped preserve design consistency during implementation.

KEY DECISION

Document reusable behaviour and states, not only static screens.

DELIVERABLES
Approved designs Interactive prototype Developer handoff
PROJECT OUTCOME
CONFIRMED DELIVERY OUTCOMES — NO UNVERIFIED PERFORMANCE METRICS
CLIENT APPROVED
Final product design approved
Reviewed through weekly client presentations and revision rounds
DEV READY
Complete development handoff
Approved screens, components, prototypes and interaction guidance
UNIFIED SYSTEM
Connected product structure
Shared navigation and patterns across complex CRM modules
REUSABLE UI
Scalable interface patterns
Repeatable tables, forms, statuses, documents and actions
INFORMATION ARCHITECTURE
A clear structure connecting client, proposal, contract, onboarding, campaign and document workflows.
PRODUCT CONSISTENCY
Shared interface logic reduced visual and behavioural differences between modules.
HANDOFF QUALITY
Final designs and reusable patterns were prepared for implementation by the development and QA teams.
DELIVERABLES
KEY PROJECT OUTPUTS
  • ✓Requirements analysis and module mapping
  • ✓Information architecture and user flows
  • ✓Wireframes for core CRM workflows
  • ✓High-fidelity interface design
  • ✓Reusable components and UI patterns
  • ✓Interactive prototypes
  • ✓Weekly client review and revision rounds
  • ✓Final developer handoff
DESIGN TOOLS
SOFTWARE & COLLABORATION
FIGMA UX/UI, components and prototypes
MIRO Flows, mapping and collaboration
JIRA Requirements and delivery tracking
SLACK Team communication and feedback
GOOGLE MEET Weekly client reviews
TEAM COMPOSITION
CROSS-FUNCTIONAL DELIVERY TEAM
Sole Product Designer
Project Manager
Business Analyst
Customer Success Manager
Development Team
QA Team
CHALLENGES & CONSTRAINTS
OBSTACLES ENCOUNTERED
1
Complex interconnected workflows
Client records, proposals, contracts, onboarding, campaigns and documents were connected, so changes in one area affected several other modules.
2
High information density
The platform needed to display large amounts of operational data while remaining readable, scannable and practical for daily professional use.
3
Requirements evolved during delivery
New details and edge cases appeared during weekly reviews, requiring the interface system to stay flexible without losing consistency.
4
Consistency across many modules
Tables, forms, statuses, actions and document workflows needed shared behaviour so the product felt like one connected system.
LESSONS LEARNED
KEY TAKEAWAYS
1
Structure before visual detail
Complex products become easier to design when module relationships, navigation and information hierarchy are resolved before high-fidelity UI.
2
Consistency reduces cognitive load
Shared patterns for tables, forms, statuses and actions helped users understand new modules without relearning the product.
3
Frequent reviews prevent late rework
Weekly client presentations surfaced missing details and edge cases early, while changes were still easier to absorb into the system.
4
Design systems support product growth
Reusable components and repeatable page structures made it possible to add new workflows without creating visual and behavioural fragmentation.
SELECTED PRODUCT SCREENS
ANONYMISED ENTERPRISE CRM INTERFACES
AGENCY DASHBOARD
01 / 03
Anonymised enterprise CRM agency dashboard
INTERESTED IN WORKING TOGETHER?
LET'S BUILD YOUR NEXT PRODUCT

Whether you need a Design Lead embedded in your team, a complete product redesign, or a design system built from scratch — let's talk.

INSIGHTS

DESIGN INSIGHTS / PRODUCT / SYSTEMS / AI / VISUAL CULTURE

DESIGN NOTES / OBSERVATIONS / SYSTEMS
STATUS
ACTIVE
FOCUS
PRODUCT + DESIGN

THINKING ABOUT PRODUCTS, SYSTEMS AND THE TOOLS CHANGING HOW WE WORK.

A growing collection of notes on product design, UX systems, visual thinking, AI and the practical decisions behind digital products.

ENTRIES
01
UPDATED
SEP 2026
LATEST UPDATES

DESIGN SIGNAL BOARD

NOW / NEXT
DESIGN SIGNALS
UP TO DATE
STATUS
TYPE
SIGNAL
INFO
FEATURED SIGNAL

CURRENT THINKING

INSIGHT / 003
RECENT ENTRIES

LATEST FIELD NOTES

03 SELECTED
ALL ENTRIES

INSIGHTS ARCHIVE

03 ENTRIES
EXPANDING INSIGHTS

COMING NEXT

ROADMAP
COURSES

DEEP DIVES

Structured learning around product thinking, UX systems and design decision-making.

PLANNED
TUTORIALS

PRACTICAL FLOWS

Walkthroughs covering workflows, tools, prototyping and design-to-development handoff.

PLANNED
RESOURCES

TOOLS TO USE

Templates, frameworks and downloadable material built around real design work.

PLANNED

START A CONVERSATION

TELL ME ABOUT YOUR PRODUCT, TEAM OR DESIGN CHALLENGE

CONTACT DETAILS
WORK MODE
REMOTE
AVAILABILITY
PROJECTS
● SELECTED OPPORTUNITIES
COLLABORATION
Remote · EU · UK · US
RESPONSE
Within 24–48 hours
ENGAGEMENT
Project · Contract · Ongoing
PROJECT INQUIRY
INITIAL CONTACT
I review your message, product context and the type of support you need.
DISCOVERY CONVERSATION
When useful, we arrange a short call to clarify goals, priorities and constraints.
SCOPE & NEXT STEPS
We agree on the scope, collaboration model, timing and practical next steps.
PORTFOLIO SYSTEM / V1.0

SYSTEM
MANUAL.

SITE ARCHITECTURE · DESIGN SYSTEM · BRAND MARK

The structure, visual language and identity behind igorsaponja.com. Built as one connected product system with clarity, consistency and purpose.

STRUCTURED CONSISTENT ACCESSIBLE RESPONSIVE
Igor Saponja personal mark INDEX / 000 WORK / 090 PROCESS / 180 ABOUT / 270

SYSTEM MANUAL

SITE ARCHITECTURE · DESIGN SYSTEM · BRAND MARK

01

SITE ARCHITECTURE

REF: IA-01
STRUCTURE / PURPOSE

The site architecture is designed around a clear evaluation path. Visitors can quickly understand the work, professional background, design process and available ways to collaborate.

PRIMARY NAVIGATION SECONDARY CONTENT RETURN PATH
ROOT / 00
INDEX Primary entry point
PAGE / 01
WORK Selected product and visual design
PAGE / 02
ABOUT Experience, background and capabilities
PAGE / 03
SERVICES Design support and engagement scope
PAGE / 04
PROCESS End-to-end product design approach
PAGE / 05
CONTACT Project inquiry and collaboration entry
SUPPORT / 01
LEARNING HUB Articles, guides and practical learning resources
SUPPORT / 02
SYSTEM MANUAL Architecture, identity and design-system documentation
LEGAL / 01
LEGAL PAGES Privacy, terms and cookie information
PRIMARY USER JOURNEY
01 ARRIVE Understand role and positioning
02 SCAN Review selected work quickly
03 EXPLORE Open relevant case studies
04 VALIDATE Check process and capabilities
05 CONNECT Review collaboration options
06 CONTACT Share project information
07 RETURN Navigate back without dead ends
02

DESIGN SYSTEM

REF: DS-02
FOUNDATIONS / COMPONENT RULES

Shared colour, typography, spacing and component rules keep every page connected while allowing individual projects to remain visually distinct.

COLOUR SYSTEM / ACTIVE TOKENS
BACKGROUND --bg / PRIMARY CANVAS
PANEL --panel / CONTENT SURFACE
AMBER --am / PRIMARY ACCENT
STATUS GREEN --hud / ACTIVE STATE
INFORMATION BLUE --blu / SECONDARY SIGNAL
PRIMARY TEXT --txtb / HIGH EMPHASIS
TYPOGRAPHY / THREE-LEVEL SYSTEM
DISPLAY / BARLOW CONDENSED
PRODUCT SYSTEM
BODY / BARLOW
Clear and readable interface content.
DATA / SHARE TECH MONO
REF: UI-02 / STATUS ACTIVE
RULE / 01 CONSISTENT BORDERS

Panels and sections use shared border tokens and precise alignment.

RULE / 02 MEASURED SPACING

Spacing supports hierarchy without creating excessive empty areas.

RULE / 03 VISIBLE STATES

Hover, active, focus and status states use clear visual feedback.

RULE / 04 REUSABLE PATTERNS

Shared cards, headers and controls reduce visual fragmentation.

03

BRAND MARK

REF: BM-03 / FINAL
ORIGIN / CONSTRUCTION / USAGE

The personal mark is derived from the caron above the Latin letter Å  in the surname Å aponja and transformed into an independent identity symbol.

Igor Saponja brand mark CLEAR SPACE / 1X HORIZONTAL AXIS MASTER GEOMETRY

FROM SURNAME TO SYMBOL

The accent was isolated from the surname and refined into a compact mark. The final form is simple enough for a favicon while retaining a direct personal connection to the name.

SPEC / 01 FIXED GEOMETRY The approved symbol must not be redrawn or reshaped.
SPEC / 02 CLEAR SPACE Keep surrounding content outside the defined safety area.
SPEC / 03 THEME-AWARE Dark and light modes use their corresponding approved assets.
SPEC / 04 SMALL-SCALE READY The form remains legible across navigation and favicon sizes.
Light version of the Igor Saponja brand mark
VERSION / 01 LIGHT VERSION Used on light surfaces and documentation views.
ICON SIZE 24px
ICON SIZE 48px
ICON SIZE 64px
Dark version of the Igor Saponja brand mark
VERSION / 02 DARK VERSION Primary version for dark theme and dark interface surfaces.
ICON SIZE 24px
ICON SIZE 48px
ICON SIZE 64px
White brand mark on dark background
VERSION / 03 WHITE ON DARK Used where maximum contrast is required on dark backgrounds.
ICON SIZE 24px
ICON SIZE 48px
ICON SIZE 64px
USAGE NOTE

Use the correct version based on background contrast and theme context. The icon-size previews show how the mark behaves in smaller digital sizes commonly used for favicons, app-style icons and compact UI placements.

04

UX LOGIC

REF: UX-04
USER JOURNEY / DECISION SUPPORT

The experience answers the visitor’s main questions in a deliberate sequence—from initial orientation and project evaluation to confidence, contact and a clear next step.

01 ORIENTATION Every page clearly communicates where the user is.
02 PROGRESSIVE DETAIL Overview content appears before deeper project evidence.
03 CONTEXTUAL ACTIONS Calls to action reflect the content currently being viewed.
04 RETURN PATHS Users can return to the index without losing orientation.
01
UNDERSTAND Role, focus and value
02
EVALUATE Relevant work and evidence
03
VALIDATE Process and capabilities
04
CONTACT Project context and next step
DECISION / 01 WORK FIRST

Selected projects appear early because relevant work provides the clearest evidence of capability.

DECISION / 02 NO PUBLIC PRICING

Project scope is shaped around the product, team, complexity and level of design support required.

DECISION / 03 LOW-FRICTION INQUIRY

The inquiry flow collects useful project context while keeping the first contact simple and direct.

05

VISUAL LANGUAGE

REF: VL-05
STRUCTURE / SIGNAL / FOCUS

The visual direction combines technical precision with restrained editorial presentation. System elements organise the content without overpowering the work itself.

PRINCIPLE / 01

STRUCTURED GRID

Alignment, borders and measured spacing make complex information easier to scan.

PRINCIPLE / 02

SYSTEM CODES

Compact references and status labels support orientation and visual rhythm.

REF: UI-02 ACTIVE
COMPONENT STATUS
TYPE PANEL
STATE READY
MODE LIGHT
PRINCIPLE / 03

CONTROLLED FOCUS

Accent colours and interaction states direct attention toward the most important next action.

INTERACTION PRIORITY
PRIMARY ACTION
SECONDARY
SYSTEM STATUS AVAILABLE
BACKGROUND PRIMARY CANVAS
SURFACE CONTENT PANEL
PRIMARY ACCENT FOCUS / ACTION
STATUS ACTIVE / AVAILABLE
06

ACCESSIBILITY & TECH

REF: AT-06
QUALITY / IMPLEMENTATION

Accessibility, responsive behaviour and technical delivery are part of the product system from the beginning rather than additions made after the visual design is complete.

ACCESSIBILITY
SEMANTIC HTML Meaningful headings, sections, navigation, forms and controls.
KEYBOARD ACCESS Primary navigation and controls remain usable without a pointer.
VISIBLE FOCUS Interactive elements provide clear focus and active feedback.
READABLE CONTRAST Theme colours maintain hierarchy and legibility.
ALT TEXT Informative imagery includes useful alternative descriptions.
RESPONSIVE CONTENT Essential information remains available on smaller screens.
TECHNICAL SYSTEM
HTML Semantic single-page interface structure ACTIVE
CSS Responsive design tokens and components ACTIVE
JAVASCRIPT Lightweight routing and interaction logic ACTIVE
VITE Development and production build system ACTIVE
GITHUB Version control and source repository ACTIVE
CLOUDFLARE Pages deployment and contact function ACTIVE
BREVO Transactional contact email delivery ACTIVE
HAVE A PRODUCT OR DESIGN CHALLENGE?

LET'S TURN THE PROCESS INTO REAL PRODUCT PROGRESS

Every project needs a clear direction, the right level of structure and a process that fits the team. Let’s define what matters and move the product forward.

ENQUIRY: —  |  TOTAL: £0
ORDER SUMMARY
PACKAGES SELECTED
£0