AC-iOS Final - Practical
Objective
Build an Instagram-like app for posting images with comments.
Summary
The app comprises three view controllers: a feed, an upload page and a login page. The designs to follow will illustrate and specify the design and relationship of these view controllers. The backend will be powered by Firebase.
Login
Users are required to log in before they can access the rest of the app.
Main View: Feed
Each post in the feed has two elements: a picture and a comment. The picture is a fixed square the width of the device and the text is variable height below it, resulting in non-uniform cell heights. Therefore use Auto Layout to drive automatic cell heights.
Upload View
Backend
Authentication
Use Email/Password authentication to you can register and log users in.
Database
The simple schema is illustrated by this diagram. This will probably make the most sense for your app.
Storage
The file structure of the storage is illustrated here:
Note the relationship between image names and objects in the database. You can use the same UID for both.
Uploading Images
Be sure to render your images into compressed JPEG format as we did in the review.
Here's a line of code that takes a UIImage and generates a Data object
with JPEG data.
let image: UIImage = ...obtain uiimage somehow...
let data = UIImageJPEGRepresentation(image, 0.5)Rubric
| Criteria | Points |
|---|---|
| App uses AutoLayout correctly for all iPhones in portrait | 8 Points |
| Variable Naming and Readability | 4 Points |
| App uses MVC Design Patterns | 4 Points |
| Login screen works as expected | 4 Points |
| App uses Firebase's Auth appropriately | 4 Points |
| Users can create a post and upload it to Firebase | 4 Points |
| App uses Firebase's Storage appropriately | 4 Points |
| Users can see well-formatted posts in their feed | 4 Points |
| App uses Firebase's Database appropriately | 4 Points |
A total of 40 points
Individual Screen Details
Login
| Login Success | Login Failure |
 |
 |
Feed
| Main Feed Extended | Main Feed Extended Scaling |
 |
 |
Upload
| Showing Roll: Beginning Modal | Showing Roll: Mid Model | Showing Roll: Finished Modal, Album View |
 |
 |
 |
| Uploads Selected | Uploads Success |
 |
 |
| Main Feed - After Upload | Uploads Failure |
 |
 |