Posted: August 2nd, 2022
Assignment 5 (Building (simulating) a Derby app with PhoneGap)
Book ref: https://download.e-bookshelf.de/download/0000/6567/87/L-G-0000656787-0007218801
The requirements for this Derby app
is to provide two screens; one that lists all of the teams/leagues and one that lists all the players. When a league/team is selected, the application shows the roster (screen) for the team. When a player is selected, it shows which team (screen) the player belongs to and his/her number.
Your goal is to:
1. Download and install Figma (can use comparable SW of your choice) on your computer. This is same as used in previous simulation assignments.
2. Model each screen using Figma – from the Figma widgets/icons library, select figures (circles, rectangles, ovals, call-outs, etc) to represent the UI elements needed for your two screens,
3. Place these figures onto a two design canvas that reflect the two screens that you are modelling.
Work 1: Make one screen shot here that shows you have
install the Figma modelling/wireframing tool (or a comparable tool of your choice)
and did some modelling
* You are ready to start simulating your app (two screens/interfaces that match Figure 11:29 and Figire 11:30 above). First, state what platform (iOS, Android, Windows, etc.) you are simulating.
1. Select two mobile app templates appropriate for the platform that you are simulating – one for each prototype screen.
2. From the Figma widgets/icons library convert figures from your model; carefully size and position these as UI elements (icons, Button, View, Tablelayout, etc.) that follow the (Figure 11:29, p.334) – list of Derby teams (first prototype screen)
3. From the Figma widgets/icons library convert figures from your model and carefully size and position as UI elements (icons, Button, View, Tablelayout, etc.) that follows the (Figure 11:30, p.335) – a Derby roster search (second prototype screen)
4. Place each of your prototype screens onto a mobile app template that you selected above. (I suggest here that you identify/label EACH UI element used on each prototype screen).
(this is your simulated mobile app)
1. For your first prototype screen – list of Derby teams, explain Each UI element describing what/how it gives functionality to your simulated app. Hint: there must be a scroller, a query, and storage function like lawnchair in order for this to work.
2. For your second prototype screen – a Derby roster search, explain Each UI element describing what/how it gives functionality to your simulated app. Hint: need a textbox, a search button and onDeviceReady function.
3. Describe/explain 4 principles of mobile interface design that are employed in your simulated app (see chapter 4 and the article: “Principles of mobile interface design” left in this week’s Learning Materials section
4. Explain native features that are peculiar – must exist for the platform you are simulationg (example: BackStack and 4 fundamentals for Android; basic functions of iOS apps (see chapter 6 – Androd; chapter 7 – IOS).
When you are ready to post, click the Week 13 – Assignment 5 (Building (simulating) a Derby app with PhoneGap) assignment link, then Either click the ” Write Submission” link and directly paste your screen shots into this assignment box OR Browse your Computer and add the entire Microsoft Word document as an attachment (Mac users, please remember to append the ” x” extension to the filename).
Place an order in 3 easy steps. Takes less than 5 mins.