MOYA Analytics Website & Mobile

I worked directly with the founders to design MOYA Analytics's website and mobile experience, along with a design system to support consistency and future development. The focus was on clarity, structure, and scalability.

MOYA Analytics Website & Mobile

I worked directly with the founders to design MOYA Analytics's website and mobile experience, along with a design system to support consistency and future development. The focus was on clarity, structure, and scalability.

Role

Interaction Design

Design System

Annotations

Tools

Figjam

Figma

Google Sheets

Timeline

Ongoing

Team

CEO - Aniq Ahsan

Co Founder - Liow Hon Shin

Director - Aiman Shakeel

Software Engineer

Marketing Associate - Aurelia Hanjaya

About MOYA Analytics

MOYA Analytics is a Singapore-based climate-tech company providing a platform for accessible carbon accounting and sustainability analytics, helping businesses and governments track emissions (Scopes 1, 2, & 3) and strategize decarbonization using dynamic, physics-informed dashboards and simulations. Here is the website: https://www.moyaanalytics.com/

MOYA Analytics is a Singapore-based climate-tech company providing a platform for accessible carbon accounting and sustainability analytics, helping businesses and governments track emissions (Scopes 1, 2, & 3) and strategize decarbonization using dynamic, physics-informed dashboards and simulations. Here is the website: https://www.moyaanalytics.com/

The Problem

MOYA Analytics needed a clear, structured website that explained the product and company effectively, while establishing a design foundation that could scale as the product evolved.

MOYA Analytics needed a clear, structured website that explained the product and company effectively, while establishing a design foundation that could scale as the product evolved.

Requirement Gathering

  • Worked with founders to clarify goals, content structure, and user needs

  • Created a list of pages that can be included in the website

Page sections that can be considered for the website

Page sections that can be considered for the website

Wireframes

I created wireframes based on the requirement gathering because it will be easier to know what pages I can put for the hi fidelity designs

Website Wireframes

Mobile Wireframes

High Fidelity Designs

  • Designed responsive layouts focused on readability and usability

  • Ensured consistency across screen sizes

Hi Fidelity Website Designs

Hi Fidelity Mobile Designs

Design System

  • Created reusable components and layout rules

  • Defined typography, color usage, spacing, and interaction states

Annotations

  • Documented spacing, behaviors, and component usage

  • Supported smoother collaboration with developers

Website Annotations

Mobile Annotations

Outcomes

Due to time and budget constraints, our team needed to deliver something quickly. Hence, the online website design is not the same as the one that I designed in Figma. The Figma designs have been approved by everyone. This will designed in the future

Key Learnings

  • Foundational design work benefits from strong structure and documentation

  • Design systems improve long-term consistency, even at early stages

  • Clear alignment early prevents rework later




Create a free website with Framer, the website builder loved by startups, designers and agencies.