COMP3130 2022-Assignment 1
DEPARTMENT OF COMPUTING
COMP3130 2022 Mobile Application Development
Major Work Deliverable-1 (25%)
Design and Development of a Mobile Application
Wednesday Apr 20, Study Break Week-2, 5 pm (Marked out of 100)
Submission Instructions 1 Problem Statement 2 Task Descriptions 2 Task 1: Design 2 Task 2: Development 2 Task 3: Report 2 FAQs 3
Submission Instructions You will submit these Tasks on three different links on iLearn. 1. For Task 1, a report (.pdf file) along with wireframes and mock-ups of every screen design with comments, if required. Each screen’s wireframe and mock-up have to be parallel to each other in the same page. Rename this file to Task1_YourName_StudentID.pdf 2. For Task 2, a zip file of your project (Compress your project folder and submit it). Please add a readme file if you have any specific instructions. Rename this file to Task2_YourName_StudentID.zip 3. For Task 3, a report (.pdf file) answering the questions provided under Task 3 descriptions on Page 2 of this document. Rename this file to Task3_YourName_StudentID.pdf
COMP3130 2022-Assignment 1
2
Problem Statement You are required to create a mobile application using expo/react-native in a platform of your choice. The theme is creating an app to record memories. Using the app, the viewer must be able to browse through their memory collections. Once logged in, the user must be able to add, delete and update every content they have added. Please note this is an open-ended problem statement and you are encouraged to try new concepts that are not covered in the lectures/workshops. It is up to you, how you choose to implement this. You are allowed to add/delete one/two more screens if you want. Ideally, the number of screens here should be sufficient to display all the information. Please note, you are allowed to change the content in the screen as well. Below is just an idea of how you can arrange your content.
Welcome Screen: This could be your first screen (You may choose to add a Splash screen as your first screen) that provides the options to register and login.
Register Screen: In this screen, the user must have the option to register and create an account.
Login Screen: In this screen, the user must use their username and password to login.
Account Screen: This is the home screen for the users that provides the option to go to their memory collections (Here is the place where tabs would start to appear and you could use that for navigation too). An option to logout must take the user back to the Welcome Screen.
Memories Screen: This is the screen that displays all the memories from a collection. Within a collection, the user must be able to filter through the categories and display them. There must be an option on the screen (either in the tab/on the screen) to add an item to the collection. If you want to add your edit and delete option here, you may do so.
More Information Screen: This is the screen that displays the listing in detail. If you want to add your edit and delete option here, you may do so. Task Descriptions Task 1: Design Create wireframes and mock-ups for every screen in the mobile application. If the application is designed for iOS then the mock-up should reflect that. The designs must be consistent with the application that is submitted for Task 2. Export the wireframes and mock-ups in a pdf and include this in your submission Task 2: Development Using a wide range of components and APIs that are provided by react-native, build a mobile application based on the specifications provided in the problem statement. You are highly encouraged to create custom components, and use them where ever applicable. You are also expected to use Stack and Tab Navigation to help navigate between screens. You will also be graded for good programming practices such as naming conventions, commenting, etc. Please include a readme file for instructions such as OS, the device you want us to test it, and any extra instructions. Task 3: Report 1. Create a storyboard (simple one) that shows the links between the screens. A sample has been provided for a different case study (Please use that as an example) 2. Write a 750 word report on the good practices of UI design you have used and the justification on the elements on the screen. If you are citing external links, please APA style of referencing to site
COMP3130 2022-Assignment 1
3
FAQs
1. Is there a mandatory tool to use? Can I just draw and submit the wireframes/mock-ups?
No, you can use any tool available (Lucid Chart/Figma are quite easy to use). Your aim is to clearly and
concisely present your ideas. Only thing you need to be very particular about is legibility.
2. Do we need to have a cover page on the document we are uploading?
Nope.
3. Do we need to read the assignment forum?
This will be the primary place where assignment questions will be answered. Any updates will also be posted
there. It is your responsibility to monitor this forum regularly. As with any job, you will want to be up to date
on the latest information related to your tasks.
4. Are we only allowed to submit our assignment one time?
You can submit multiple times before the due date, so be sure to have early versions uploaded just in case
iLearn (or your internet connection) has any issues.
5. Can we make some of the pages landscape and some portrait?
Yes, you can have some pages in portrait and some in landscape (especially if it helps make the diagrams
more readable).
6. Can I use both platforms to write codes on?
Yes, however you will have to nominate one of the platforms as your preferred one and your app will be
checked on that platform.