Get in touch
Portfolio About Contacts

OPPO Reno11 5G — Product Landing Page

Design and development of a product-focused landing page for the OPPO Reno11 5G centered around portrait photography, elegant industrial design, and lifestyle-driven storytelling.

Year

2024

Client

Oppo

Industry

Electronics

Service

Landing Page

OPPO Reno11 5G — Product Landing Page

Task

The project aimed to create a lightweight, visually refined mobile experience that communicates the smartphone’s creative capabilities while reinforcing OPPO’s modern and approachable brand identity.

Objectives

Emphasize portrait photography as the core product differentiator

Create a clean and emotionally engaging visual experience

Present technical specifications in a user-friendly format

Highlight the device’s slim form factor and premium materials

Build a smooth mobile-first browsing flow optimized for long-scroll interaction

My Role

Art Direction, UI/UX Design, Visual Design, Layout System, Mobile-first adaptation, Product storytelling, Content composition.

Design Approach

Unlike traditional dark flagship presentations, this landing page uses a bright and airy visual language inspired by lifestyle photography and fashion-tech aesthetics.

The experience was structured as a sequence of focused narrative sections:

  • Portrait camera system
  • AI-enhanced photography
  • Design and material presentation
  • Battery and charging capabilities
  • Display experience
  • Productivity and ColorOS ecosystem

Each block was designed to feel lightweight and editorial while still delivering dense product information in a digestible format.

Visual Language

Soft Premium Aesthetic

A pastel-inspired palette, generous white space, and soft gradients were used to create a more approachable premium feel compared to conventional tech landing pages.

Lifestyle-Oriented Presentation

Photography and human-centered compositions play a key role throughout the experience, helping position the device as a creative everyday companion rather than purely a technical product.

Product-Focused Storytelling

Large device renders are combined with contextual imagery and modular information blocks to guide users naturally through the product benefits.

Mobile-First Experience

Special attention was given to:

  • Comfortable content pacing
  • Clear typography hierarchy
  • Simplified technical presentation
  • Touch-friendly composition
  • Balanced visual density on smaller screens

Challenges

One of the primary challenges was balancing minimalism with a large amount of marketing and technical content. Since the page contains many product features, maintaining visual clarity across the entire scroll experience required careful hierarchy management.

To solve this:

  • Information was divided into compact visual chapters
  • Alternating layouts were introduced to avoid repetition
  • Technical specifications were simplified into scannable blocks
  • Large imagery was used strategically to create visual pauses

Another challenge was preserving brand softness while still making the product feel technologically advanced. This was achieved through the combination of clean typography, elegant spacing, and subtle high-tech visual accents.

Result

The final landing page delivers a polished and modern mobile experience that successfully combines lifestyle aesthetics with product marketing. The design highlights the camera-focused identity of the device while maintaining a clean, premium, and highly accessible interface optimized for mobile audiences.

More cases

Continue exploring

More Cases

2025

Product Design

Design System for Promo Landing Pages

M.Video

Design System for Promo Landing Pages

2024

Landing Page

Mobile App Design

Product Design

M.Finance — End-to-End Product Design for Mobile App & Marketing Landing

M.Video

M.Finance — End-to-End Product Design for Mobile App & Marketing Landing