NASA App

This is the final project for the Treehouse iOS Techdegree. The app uses NASA REST APIs to fetch real data and images from NASA. There are three main features of this app:

Mars Rover Postcard Maker: Choose a photo taken by a Mars rover. Add text to the photo and send the image as an email and save to your photo library.

Eye in the Sky: Navigate to an area on a map that you want to see a satellite photo of.

APOD: Browse NASA's APOD (Astronomy Picture of the Day) photos and share them to Facebook.

 

Technical Background

Because this app was the final project, the requirements were more open-ended. The UI/UX was pretty much up to us as long as the required features were implemented. The Mars Rover Postcard Maker and the Eye in the Sky were required, but the third feature was left to us to decide what it would be. I chose APOD (Astronomy Picture of the Day) because I think it's full of beautiful and inspiring photos that look great on a retina display.

This app relies heavily on data requested from NASA REST APIs, so there is a significant amount of code dedicated to Codable models, generating REST API endpoints, and fetching data via URLSession. 

Mars Rover Postcard Maker

For the Mars Rover Postcard Maker, a UICollectionView is used to display a grid of photos to choose from. Kingfisher is used to manage all of these image downloads. It makes it really straightforward to set a placeholder image, download, resize, and cache images for each cell in the UICollectionView.

NASA App – Mars Rover Image Collection

The user also has many filter options to choose from. They could choose which Rover they wanted, the sol (Martian day) the pictures were taken, and which cameras took the pictures. This is great for anyone who is curious and wants to explore all of the pictures available. Luckily, the REST API has parameters for all of these filters.

NASA App – Mars Rover Filters

For the postcard creation UI, it consists of a UIImageView and UITextView on top. These are both children of a parent UIView which can be rendered to a flat png image. The png image can then be saved to the device's Photos library and sent as an email attachment. The MessageUI framework makes sending emails fairly straightforward.

Allowing the user to control the text required a fair amount of code. A color picker was added to the bottom which is a UICollectionView with only one row. Each cell is a circle drawn with a Core Animation shape layer. Swipe gesture recognizers were added to the editable photo area to allow the user to choose the alignment of the text. Display of spell checking lines had to be turned off otherwise they would be rendered to the final saved image.

NASA App – Mars Rover Postcard Maker
NASA App – Mars Rover eMail
Eye in the Sky

This portion of the app uses a searchable map view to fetch satellite imagery in the same region. UISearchController is used to search for places of interest. An MKLocalSearch searches for places nearby as the user types in the search bar. The results are displayed in a UITableViewController. Once the user finds the spot they are looking for, they can view the corresponding satellite image which is fetched using the GPS coordinates and region range from the map view. A query is made to the NASA Earth Imagery REST API to get a satellite image download link. This is then downloaded with Kingfisher and displayed in a UIImageView.

NASA App – Earth Imagery Map
NASA App – Earth Imagery Map Search
NASA App – Earth Imagery Satellite Photo
APOD

The part of the app for the Astronomy Picture of the Day gives the user two ways to navigate images. There is a UICollectionView with a grid of pictures that the user can choose from. Each section shows the month and year. The APOD API allows you to query it using a start and end date, so I programmed it to treat each month as a page of data. The image downloads are managed with Kingfisher the same way the Mars Rover images are. Once a user selects one of the images in the collection view, it shows a UIPageViewController which the user can swipe through to navigate from one day to the next. This displays the details of the picture for the day that was fetched from the REST API.

NASA App – APOD Image Collection
NASA App – APOD Paged Display

A Facebook share button was added to allow anyone to share the picture for that particular day. Implementing this was not as trivial as it looks as this required the creation of a Facebook developer account, registering the app with Facebook, creating test users, and setting up the SDK with Carthage and in Info.plist. To actually add the share button with Swift did not require much code which was a relief after all the setup involved.

NASA App – APOD Facebook Share