Revamping the Calendar in Sky Tonight

Oct 11, 2022
Stargazing calendar in the astronomy app Sky Tonight
Image Credit: Vito Technology, Inc.

The Calendar section has been present in the Sky Tonight app since its release. It allowed users to see the upcoming stargazing events and plan their observations. However, neither we nor our users were satisfied with the initial version of the Calendar. Here’s how we improved it by remaking it from scratch.

Who we are: Vito Technology is a mobile app development company that has been creating high-quality products for over 20 years. Our main fields of interest are astronomy and education.

What was wrong

The main problem was that the Calendar looked too much like the Visible Tonight section. Both sections provided a list of upcoming astronomical events. The difference between them was that the Calendar showed all the events observable from the Earth, while Visible Tonight showed only the events (and objects) visible in the user’s location. This difference was very unclear to users, plus the Calendar didn’t have much of a unique value.

Another problem was that the Calendar was poorly organized: to open a particular date, you needed to either tap the arrows or scroll down the long list of dates and their events. This happened because most of the time, you could only see one date of the Calendar on the screen.

What we improved

We considered all the drawbacks and gave the Calendar a complete overhaul. First of all, we made the Calendar look more “traditional” — now it has a linear grid view that most users are familiar with. You can see all the dates of a particular month on one screen and quickly switch between them.

Also, we’ve added four tabs devoted to various kinds of stargazing info: Events, Moon, Meteors, and Sky. All tabs have a similar visual structure: a grid with dates and an info section below it. Let’s take a closer look at each of the four tabs.


On the Events tab, you can see all notable celestial events that will occur in a particular month — conjunctions, oppositions, meteor shower peaks, etc. The calendar grid has colored icons that mark different types of events. They allow users to understand right away how many events occur each day and what these events are. If you tap a particular date, you’ll see a corresponding list of events below the calendar grid.


On the Moon tab, there’s a Moon phases calendar. In a clear and concise way, it shows the Moon phases for every day of the chosen month. This tab will be helpful if you enjoy watching the Moon as it waxes and wanes in the sky or if you want to choose a moonless night for stargazing.

Little blue icons indicate the four main phases of the Moon: New Moon, First Quarter, Full Moon, and Last Quarter. You can tap any particular day to see the Moon’s illumination percentage, rise and set time, and other information. The Moon’s image at the bottom of the screen reflects the position of the shadow on the Moon as seen from your location. The Moon’s size also changes in accordance with the apparent size of the “real” Moon in the sky.


The Meteors tab shows the active meteor showers in the chosen month. We devoted a separate tab to this type of astronomical event because meteor showers last for a long time. Adding them to the Events tab would have “overloaded” the calendar grid and the events list.

Each meteor shower is color-coded and represented by a line on the calendar; a dot on the line signifies a shower’s peak. With the Meteors tab, you can quickly choose the best dates for meteor observation.


The Sky tab is probably the most tricky to get your head around. It shows information about the rising and setting of the Sun and the Moon, hours of twilight, total darkness (the time after the evening astronomical twilight ends and before the morning one starts), and more. The tab has two views: you can switch between them by tapping the blue icon in the upper-right corner of the screen.

In the “circular” view, each calendar day is shown as two circles: the outer circle represents the Sun, and the inner circle — the Moon. The numbers on the circles show the hours of the day. Each colored section represents its own piece of information: dark green shows the time when the Sun or the Moon is below the horizon, bright green stands for total darkness, pink, violet, and purple show three different types of twilight, etc.

The “linear” view provides the same information but in the form of a horizontal timeline. The thin gray line in the upper part of the timeline represents the Moon, the wide green stripe in the middle shows total darkness, and the thin yellow line at the bottom is for the Sun and twilight. Little arrows on the lines show the rising and setting times of the Sun and the Moon.

As you can see, the new Calendar bursts with useful stargazing info that can be quickly accessed without too much tapping or scrolling. Yet, there’s still room for improvement in terms of design: the Meteors and Sky tabs can definitely be made more beginner-friendly.

Bottom line: The Calendar used to look too much like the Visible Tonight section and wasn’t very convenient to use. We completely reworked it and packed it with tons of helpful info, including Moon phases, active meteor showers, hours of twilight, and much more. Please don’t hesitate to tell us what you like and don’t like about the new Calendar! You can write to us on our social media platforms or via