View
MENU
MENU
Work
About
Resume
繁中
|
EN
Category :
Web UI
/
Year :
2025
/
Responsibility :
UI design
/
Client :
Techworkslabs

SuperTechNova

Project Overview

Background

SuperTechNova is the e-commerce website product launched by eGadgetsDeals after a visual redesign, aiming to provide consumers with a more modern, intuitive and efficient shopping experience. Through brand upgrades, SuperTechNova adopted a new logo design, more technologically advanced color combinations, and optimized UI elements to make the overall visual more in line with technological trends.

Goals & Objectives

Continue to promote digital retail innovation, strengthen competitiveness in the electronics market, and attract more consumers interested in technology products.

Role & Deliverables

Without changing the original framework, I was responsible for re-setting the UI style of eGadgetsDeals, making design adjustments, and finally delivering the complete visual results.

Challenges

Without changing the original UI structure, a new visual style is created, while ensuring that users can experience a brand-new visual experience. In addition, it is necessary to improve the consistency and recognition of the overall design while maintaining existing functions and user habits, so as to make the brand image more distinctive and attractive.

Results & Impact

We successfully launched the new brand within two months and our revenue continues to grow. At the same time, the existing version is still being optimized to further enhance user experience and brand competitiveness.
Branding

Direction

Our strategy for SuperTechNova focuses on aligning the brand with its tech-forward e-commerce vision. Through a sleek and streamlined design, the visual identity communicates innovation, clarity, and strong brand recognition.

The overall palette features a gradient of deep to bright purple, symbolizing technological energy and the brand’s ever-evolving spirit. The custom typography blends futuristic aesthetics with a sense of speed and motion, while the sharp horizontal cut—accentuated by a radiant starburst—adds a feeling of momentum and forward-thinking innovation.

The elliptical platform beneath the logo reinforces the concept of “Nova,” suggesting a rising star gathering energy. Together, these visual elements express SuperTechNova’s role as a trustworthy, cutting-edge tech commerce platform—one that embraces change and leads the way into the future.

SUPERTECHNOVA Logo

A symbol of technology, innovation, and a futuristic vision.
The four-way radiating sharp corners bring a precise and kinetic visual tension, and also represent the dynamic feeling of glowing, growing, and leading the trend.
A symbol of technology, future and unique.
Presented in the form of pixels and scanning light, the design looks more futuristic while retaining a strong recognisability, making the logo easily recognisable and memorable.

Colors

- Nebula, Amethyst, and Violet.These are the core colors used across all brand assets, establishing a strong and recognizable visual identity. They convey a sense of sophistication, creativity, and futuristic energy.

- Lavender, Lilac, and Mauve.These softer hues serve as background colors, enhancing visual depth and adding subtle contrast. By supporting various brand elements, they improve readability and create a balanced, harmonious aesthetic. Their presence allows for easier discernment of key content while maintaining an elegant and modern feel.
- Nebula, Amethyst, and Violet.These are the core colors used across all brand assets, establishing a strong and recognizable visual identity. They convey a sense of sophistication, creativity, and futuristic energy.

- Lavender, Lilac, and Mauve.These softer hues serve as background colors, enhancing visual depth and adding subtle contrast. By supporting various brand elements, they improve readability and create a balanced, harmonious aesthetic. Their presence allows for easier discernment of key content while maintaining an elegant and modern feel.
Nebula
Amethyst
Violet
Lavender
Lilac
Mauve
Guideline
website

The design emphasizes visual hierarchy, product display, a convenient shopping experience, and a clear navigation system.

Landing Page-Home Page

Through banner images, product blocks of varying sizes, and clear headings, users can quickly focus on important promotions. The navigation bar and search bar are designed to be simple and intuitive, allowing users to easily find the products they need. Also, the product category blocks and recommendation sections are organized neatly, enhancing the user experience. The page uses a white background with deep purple as an accent color, making the entire site look clean and fresh, and easy to read and navigate.
Through banner images, product blocks of varying sizes, and clear headings, users can quickly focus on important promotions. The navigation bar and search bar are designed to be simple and intuitive, allowing users to easily find the products they need. Also, the product category blocks and recommendation sections are organized neatly, enhancing the user experience. The page uses a white background with deep purple as an accent color, making the entire site look clean and fresh, and easy to read and navigate.
The left sidebar provides various filtering options, helping users quickly narrow down the range and find products that meet their needs. The top of the page offers sorting options based on relevance, price, and more, while the bottom of the page allows users to choose the number of products displayed per page, enhancing flexibility. The top of the page maintains a clear navigation menu and search bar, enabling users to easily jump to other categories or perform a search at any time.

Product List & Content Page

The left sidebar provides various filtering options, helping users quickly narrow down the range and find products that meet their needs. The top of the page offers sorting options based on relevance, price, and more, while the bottom of the page allows users to choose the number of products displayed per page, enhancing flexibility. The top of the page maintains a clear navigation menu and search bar, enabling users to easily jump to other categories or perform a search at any time.
Next Project
rh chat