Designing the interface for a innovative weather prediction system

* Name, colors, styles and some information has been altered/removed and limited screens are shown as I was not allowed to disclose the actual product due to it being under confidentiality agreement.


Project type

Internship Project, Solo(design), Currently under development

My Responsibilities

UX design, Branding, Copywriting, UI+Interaction design


July 2021 (1 month)

Project Overview

The Challenge

Design a website for weather prediction system 'Weathr', to showcase and market the product, letting users explore, compare and find out about the solution to persuade them to adopt it.

The Goal

A usable and delightful experience that would ensure user retention and leave a strong brand imprint, helping towards growth in conversion rates.

What is Weathr?

Weathr is state-of-the-art innovative weather prediction system, which follows traditional units of Hindu timekeeping, and presents important dates and their calculations in stabulated form. Invaluable meteorogical rainfall predictions are enshrined in it. They are generalized over a region, based on an astrological phenomena like planet-star conjunctions, transits, planetary reign, etc.

white clouds


Referring to the old interface

The old 'Weathr' website landing page view






Defining the design principles


Users need to be engaged at first glance, not by expecting them to discovering elements and then inputting values to view results

The interface needs to feel like a easy delightful experience, not a clunky enterprise software

There should be a easy way to try out the system, that engages user

User should be able to compare the results against conventional weather prediction system place, rather than them having to do that separately

Low friction
Easy evaluation

User Interface

The homepage is the page where user generally lands, and therefore the prime option to grab users attention, engage them and persuade them to explore more in hope of conversion. So, the homepage constitutes of engaging exploration options balanced with delighting visuals, all in a simplified tone to not intimidate user.

Splash Page- Mobile
Weather card- Mobile

The mobile version separates the splash text and weather card. The splash screen consists of the text copy that should inform as well as influence; along with CTA being connect, for conversion goals

Weather card visually presents the brief weather info of the given day for user to either view, but primarily have a quick evaluation of the system

*Screens other than home aren't shown due to the possibility of presence of sensitive information there.

© 2021 Aditya Mukherjee

This website is not fully responsive yet. Kindly do not view on mobile devices.