Next Spaceflight
The next rocket launch right at your fingertips
What is Next Spaceflight?
Next Spaceflight is a launch tracking website and mobile app used by over 230,000 people each month. The mobile app was originally built in the native languages for iOS and Android: Swift and Java. Having two separate codebases complicates bug fixes and feature additions. The features of the Android app were more extensive and better maintained, leaving the iOS version with slow startup times, laggy settings options, and a less polished UI.
Project Goal
The first and most recent project I worked on was to rewrite the Next Spaceflight iOS and Android native apps in React Native, a framework allowing for a cross-platform app with a single codebase. The main concerns were keeping the app stable and bug-free, while also writing the codebase to be easily maintainable in the future. I was also tasked with supporting and maintaining the current Android and iOS apps.
Outcome
The app was successfully re-written in React Native, maintaining reliability while introducing a much cleaner codebase. Additional features I added included a major update to the user interface (UI), vastly improved load times, advanced launch filtering options, and a live launch countdown. I took a greenfield approach to the development, meaning I carried over no code from the previous versions and fully rewrote the app from scratch. This has the advantage of starting from a clean slate and using an architecture that is designed with future features in mind. I did not have to hold on to the legacy methods of storing and caching data, which was often slow and inefficient.
I sent the app through private and public beta testing before being released on January 3rd. I managed communication with database managers and users to add necessary features and improve existing ones. The final version maintains and improves all the features of the previous app while staying bug-free for its users.
The spider web of screens on the previous iOS app, making maintainability difficult.
UI Improvements
I greatly improved the user interface of the app. Changes included the following:
-
Added more icons throughout the app. Examples include headers, recoveries, launch statuses, statistics, and dates.
-
Improved shadows and used a purple color scheme throughout the app.
-
Improved buttons, including the “Watch” and “Wiki” buttons which previously looked more like static text.
-
Improved how dates are shown for launches, events, and starbase tests. For example, Sat May 13, 2023 9:58 PM PDT in the old app is now Saturday, 9:58 PM instead since it’s within the current week. This is much more beginner-friendly and there is still an option to show the full date instead. Furthermore, when entering the launch detail screen the time is now shown large and clear instead of small and combined with the rest of the date as with the old app.
The Starship tab on the new vs old version of the app.
Speed Improvements
Startup
I reduced the app launch time on iOS from over seven seconds to just under a second. This launch time was a major pain for iOS users of the app, as every time the system or user cleared the app from memory, the app would take another seven seconds just to load the content. The long launch time was largely due to the way the app data was being cached offline. UserDefaults, a storage system for small amounts of data such as user preferences, was being used to cache over 7,000 launches registered in the database. As the number of launches grew over time, the slowdown got worse and worse. However, this only accounted for about 1.3 seconds of the slowdown. Much more of the lag was caused by setting up all the objects/classes for the data, which was not designed for the sheer amount of past launches in the database.
I considered partially fixing the long loading time on the original iOS app, mainly by making past launches load on the background thread after the app booted. It turned out the data and classes were just too intertwined and a rewrite of the data systems would be needed, making it infeasible for the old app version.
Changing Settings
Changing any time settings (eg "Use UTC", "Use 24-hour time") would take at least 15 seconds of loading in the old app version. This was due to the app going through each launch, event, and starship test to modify each date object. In the new React Native app, all settings changes are instant.
On the right: The screen you were often stuck on when changing time settings in the old iOS app.
Fetching Data
Synchronous data fetching requests were used in some places of the app, leading to slower loading times when checking for new data. The app would request data from up to 13 endpoints, depending on the presence of cache data and if any of it was out of date. Each request would be sent individually and the app would wait for a response before sending the next request. This is improved in the new app by sending all the requests at once, leading to a speed improvement of up to 2x.
Additional Features
-
Live countdown for launches in the next 24 hours
-
Launch window visualizer with the window open and close time
-
Medium size widget and launch filtering options by editing the widget (iOS)
-
Advanced filtering options with a new filter popup on the launches screen
-
Rocket configuration active dates on the launch detail and rocket screen
-
Built-in maps for launch sites right in the launch detail screen
The redesigned launch detail screen on the app
Updated Screenshots
I spent extra time redesigning the app store screenshots in Figma to look more professional and catchy. They include four variations (iPhone 15, iPhone SE, iPad, Android) each with seven screenshots.
Old screenshots (left) vs new screenshots (right)
Future Development
The app deployment went very well, and I was promoted to manage the entire Next Spaceflight website, app, and backend. I plan to redesign the website next, adding new features along the way. This is just the start for Next Spaceflight, with a whole bunch of creative new features coming its way!
Programmed with
Swift
SwiftUI
TypeScript
Java
Python
Utilizing
Xcode
Android Studio
React Native
Figma
GitHub