Website Design / UI/UX / Digital Product / Web Application / Front-End Development

VesperScope

View live demo
VesperScope night observation planner showing the Rome observing location, date controls and an evening darkness summary

A night observation planner that turns local twilight times, Moon conditions and planet positions into an interactive guide to the evening sky.

Project
Independent project
Discipline
Website Design, UI/UX, Digital Product, Web Application, Front-End Development
Year
2026
Role
Designer, Front-End Developer
Tools & technologies
HTML, CSS, JavaScript, Astronomy Engine, Netlify
Explore
View live project ↗

A clearer plan for the evening sky

VesperScope is an independent web application for planning a night of observation. Choose a location and date to explore when darkness begins, where the Moon will be and which planets are above the local horizon.

The interface starts with an evening overview, then connects a timeline, sky view and individual object information. Visitors can use their device location or enter coordinates, with no account required.

One observing point, several ways to explore

The timeline lets visitors move through the evening and following morning, comparing above-horizon windows with the changing light. The sky view provides a visual orientation aid, while positions are also available as text.

Moon information brings together phase, illumination and observing windows. Planet cards connect placement with the selected time. Local timezone labels and next-day indicators help make sessions that cross midnight easier to follow.

Calculations with context

Astronomy Engine supplies the astronomical calculations, which run in the browser using the selected coordinates, date and time. The methodology page explains the assumptions behind twilight boundaries, altitude, direction and observing windows.

Calculated placement is a planning aid: actual visibility also depends on weather, light pollution, the local horizon and equipment. Keeping this distinction visible is part of making the information understandable.

A focused visual direction

A dark interface, restrained lavender accents and clear typographic hierarchy organise the experience around the observing task. Summary cards introduce the evening before visitors explore the more detailed controls.

The portfolio cover uses the supplied application screenshot, showing Rome as the observing location. It is displayed in full inside the shared portfolio frame. Explore the live demo to use the current planner with your own location.

Connected design work

World Data Lab explores a related challenge: making complex information approachable through clear routes and context. F1 Race Lab applies that thinking to motorsport data, while Tonight Movie Finder focuses on choosing one thing to watch.

For the interface principles behind these projects, read the guide to accessible data visualization. My front-end and digital product service connects those design decisions with implementation.

Related work.

All work ↗

Keep exploring.

All insights ↗
All services ↗

Next project

World Data Lab ↗

Have something in mind?

Let’s make it
clear. And real.

Start a project