:::statistics
[
  { "value": "300", "label": "satisfied customers in the first two months" },
  { "value": "45", "label": "seconds on page on average" },
  { "value": "450+", "label": "bikes accessible after five questions" }
]
:::

## Problem Statement

An established e-commerce client was experiencing significant issues and a lot of questions from their customers about selecting the right product. Their data

![OKAY INTRO](/images/projects/interactive-form/image2.png)

## Client Svet Elektrokol

![KOLA INTRO](/images/projects/interactive-form/image.png)

The final solution reimagined the entire checkout experience:

The entire experience was built with accessibility in mind, ensuring screen reader compatibility, keyboard navigation, and sufficient color contrast ratios.

![KOLA Form](/images/projects/interactive-form/form-1.png)

![KOLA Form](/images/projects/interactive-form/form-2.png)

![KOLA Form](/images/projects/interactive-form/form-3.png)

## Client OKAY.CZ

![OKAY Form](/images/projects/interactive-form/image3.png)

![OKAY Design](/images/projects/interactive-form/image1.png)

## Lessons Learned

The biggest challenge was convincing stakeholders to simplify their data collection, removing non-essential fields that marketing wanted to retain. The results justified this approach, showing that less friction led to more completed purchases, ultimately providing more customer data in aggregate. 


Reimagining the checkout experience

Interactive Forms for E-commerce

:::statistics
[
  { "value": "18.000", "label": "satisfied clients" },
  { "value": "1.410+", "label": "happy parents of healthy children" },
  { "value": "20.280+", "label": "recycled blister packs from project start" },
  { "value": "507.814", "label": "sold contact lenses" }
]
:::

## Problem Statement

ZORKOCLINIC, an emerging premium ophthalmology practice, presented a set of distinct branding challenges:

- Establishing a unique visual identity within a saturated and competitive healthcare landscape.
- Crafting a brand that seamlessly communicated profound medical expertise while projecting an approachable, contemporary feel.
- Appealing to a diverse demographic, encompassing young professionals through to senior citizens.
- Ensuring the brand identity's versatile application across all touchpoints, including digital platforms, the physical clinic environment, and official medical documentation.
- Innovatively sidestepping common healthcare visual tropes, yet maintaining clear recognizability as a specialized eye care provider.

A core directive from the clinic's founders was to visually articulate their dedication to pioneering technology and highly personalized patient care through the new brand identity.

![Zorko Intro](/images/projects/zorko/image1.png)

## Research

Initial market and competitor research underscored a significant opportunity: to develop a brand identity that masterfully balanced unimpeachable clinical expertise with genuine warmth and a human-centric approach. This nuanced positioning was largely absent among competitors, who typically skewed towards either an overly sterile, clinical presentation or a more impersonal, commercialized image. The research confirmed the potential for ZORKOCLINIC to occupy a distinctive and appealing space in the market.

![Zorko Bussiness Card](/images/projects/zorko/image.png)

## Design Process

![Zorko Product Design](/images/projects/zorko/image3.png)

The design process unfolded through several structured phases, ensuring a comprehensive and collaborative approach:

1.  **Brand Strategy Development**:
    - Articulated a clear brand positioning statement and defined core operational values.
    - Developed distinct brand personality attributes and established an appropriate tone of voice.
    - Formulated a robust brand differentiation strategy to stand out in the market.
2.  **Visual Exploration**:
    - Curated comprehensive mood boards to explore diverse visual directions and aesthetic themes.
    - Generated initial conceptual sketches focusing on symbolism pertinent to vision, meticulous care, and precision.
    - Investigated a range of typography options, carefully balancing optimal readability with distinctive character.
    - Developed and presented preliminary color palette options, considering psychological impact and brand fit.
3.  **Design System Development**:
    - Finalized the primary and secondary color palettes, ensuring visual harmony and accessibility.
    - Established a comprehensive typography hierarchy and detailed usage guidelines for consistency.
    - Developed a unique system of patterns and graphic elements to enrich the visual language.
    - Designed a custom iconography set to visually represent the clinic's diverse services.

![Zorko Post](/images/projects/zorko/image2.png)

![Zorko Post 1](/images/projects/zorko/image4.png)

## Solution

The resultant brand identity was cohesively built around the central concept of "Enhanced Vision, Enhanced Life," manifesting through these pivotal elements:

-   **Logo & Mark**:
    -   A memorable and distinctive abstract mark, artfully suggesting both the human eye and the precision of an optical lens.
    -   A harmonious blend of clean, geometric forms with subtle, organic elements to convey both precision and approachability.
    -   A refined wordmark utilizing a custom-modified sans-serif typeface, chosen for its clarity and modern feel.
-   **Color System**:
    -   A sophisticated primary palette featuring deep teal and warm gold, consciously diverging from conventional medical blues to create a unique and welcoming atmosphere.
    -   A complementary secondary palette of soft, grounding neutrals for supporting visual elements and backgrounds.
    -   Strategic and generous use of white space to enhance clarity, focus, and a sense of calm.
-   **Typography**:
    -   A primary sans-serif font family selected for its exceptional legibility across all sizes and digital/print media.
    -   A distinguished secondary serif typeface to add a touch of sophistication and gravitas to longer-form content and official communications.
    -   A meticulously defined typographic hierarchy to ensure clarity and ease of navigation within clinical documentation and patient materials.
    -   Optimized letter spacing, line height, and leading for enhanced readability and reduced eye strain.
-   **Visual Elements**:
    -   A custom illustration style developed to clearly and engagingly explain complex medical procedures to patients.
    -   A bespoke iconography suite that effectively balances technical precision with intuitive visual simplicity.
-   **Applications**:
    -   A comprehensive and cohesive stationery system, including letterheads, business cards, and appointment reminders.
    -   Thoughtfully designed interior signage and wayfinding systems to enhance the patient experience within the clinic.
    -   A modern and user-friendly digital presence, encompassing the main website and a secure patient portal.
    -   Recommendations for staff uniforms and clinic environment aesthetics to ensure brand consistency.
    -   Clearly designed and informative patient education materials, brochures, and aftercare guides.

## Lessons Learned

### Happy Clients

![Zorko Post 2](/images/projects/zorko/image5.png)

![Zorko Post 3](/images/projects/zorko/image6.png)

![Zorko Post 4](/images/projects/zorko/image7.png)

![Zorko Post 5](/images/projects/zorko/image8.png)

![Zorko Post 6](/images/projects/zorko/image9.png)

![Zorko Post 7](/images/projects/zorko/image10.png)

This project yielded several valuable insights that continue to inform and refine my strategic approach to healthcare branding:

-   The critical importance of striking a delicate balance between conveying robust clinical authority and fostering genuine emotional connection with patients.
-   Accessibility should not be an afterthought but a fundamental driver of design decisions from the project's inception.
-   Comprehensive patient journey mapping is indispensable for identifying and optimizing all potential brand touchpoints, ensuring a cohesive experience.
-   Engaging clinic staff actively in the brand development process significantly enhances buy-in and improves the consistency of brand implementation.
-   The nuanced challenge of avoiding prevalent industry visual clichés while ensuring the brand remains instantly recognizable and trustworthy within its sector requires a careful and strategic equilibrium.

The most significant challenge encountered was the development of a visual system that could resonate effectively with a broad spectrum of age demographics while maintaining a unified and cohesive brand feel. The ultimate solution was found by anchoring the design in universal values—such as clarity, precision, and compassionate care—rather than relying on fleeting or niche visual trends.   

Healthcare branding for premium eye care

ZORKOCLINIC Brand Identity

## Problem

Masaryk University's Medical Faculty needed a comprehensive design solution that would modernize their brand presence while adhering to their established guidelines. The challenge was to create a cohesive visual system that would resonate with both local and international students.

![MED Shop logo](/images/projects/muni-med/logo.png)

## Design Process

The project followed a structured approach with these key phases:

1. **Research & Analysis**
   - Analyzed existing brand materials and guidelines
   - Gathered feedback from current students and staff

2. **Strategic Development**
   - Defined core brand attributes and messaging
   - Created mood boards for visual direction
   - Established design principles aligned with faculty values
   - Developed preliminary concepts for key touchpoints

![Pattern](/images/projects/muni-med/image.png)

## Solution

The final design system delivered:

- A design that maintained brand recognition
- Flexible templates for various faculty communications
- Digital-first assets optimized for multiple platforms

![Display](/images/projects/muni-med/MUNI-polepy.jpg)

![Display 1](/images/projects/muni-med/MUNI-polepy-2.jpg)

![Display 2](/images/projects/muni-med/MUNI-polepy-3.jpg)

Additional benefits included:

- **Brand consistency**: Strengthened faculty brand identity across all touchpoints, from digital platforms to physical spaces
- **User engagement**: Increased student interaction with faculty communications and resources


## Final thoughts

The new design not only deliever modern and fun looking logo even in formal university environment, but also aligned with the university's brand guidelines.

E-commerce platform for medical students

MUNI MED SHOP

## Problem

While searching for a personal link tree solution, I encountered several common limitations:

- Most paid services offered bloated features I didn't need
- Limited control over design and functionality
- Monthly subscription fees for basic features
- Generic templates that lacked personality and distinctiveness

![PC Interface](/images/projects/w95/image.png)

## Research

My research focused on two key areas:

1. **Technical Implementation** - I evaluated several open-source solutions, particularly focusing on customizable frameworks that could serve as a foundation.

2. **Design Inspiration** - Windows 95's interface design represents a fascinating period in computing history. It successfully balanced functionality with visual clarity, creating an aesthetic that defined an era of personal computing. Interestingly, this retro style has gained popularity among younger users who never experienced the original OS, creating an opportunity to blend nostalgia with modern functionality.

![Mobile Interface](/images/projects/w95/image2.png)

## Solution

![PC Dark Interface](/images/projects/w95/image1.png)

The final implementation delivers a fully customized website that features:

- Pixel-perfect Windows 95-inspired design system
- Essential link tree functionality: social media links, project showcases, and contact information
- Interactive elements that enhance engagement:
  - Draggable windows
  - Context menus
  - "Programs" that simulate the classic OS experience
- Responsive design that maintains the retro aesthetic across all devices
- Custom domain with full analytics control

![Features](/images/projects/w95/image4.png)

Built using React and Next.js for optimal performance and SEO, the project combines Tailwind CSS with custom styling components to achieve an authentic Windows 95 look while maintaining modern web standards. Based on realvjy's (https://github.com/realvjy/nxt-lnk) open-source project.

## Results

The project has exceeded expectations with measurable outcomes:

- **Distinctive Personal Branding**: Created a memorable identity that showcases both creativity and technical expertise
- **Cost-Effective**: Eliminated recurring fees while maintaining full control over the platform

Current development priorities include:

- Expanding the interactive "application" ecosystem
- Performance optimization using modern web techniques
- Enhanced analytics for better visitor insights

## Final Thoughts

The primary challenge was striking the perfect balance between authentic Windows 95 aesthetics and modern usability standards. This careful equilibrium between nostalgia and functionality proved crucial to the project's success, creating an experience that's both familiar and fresh.


Viktor Porokh

Featured Projects

Interactive Forms for E-commerce

ZORKOCLINIC Brand Identity

MUNI MED SHOP

Windows 95 themed link tree

Stay Updated

Skills & Expertise

UX/UI Design

Web Design

Graphic Design

Let's Work Together