FIT3178 Assignment 1
Mobile App Design Specification
Application concept
Introduction
The application ‘poke pokedex’ is an application that integrates all the Pokémon
information from all generations, so that users can easily query the relevant
information of the Pokémon they want.
Overview of the application
The application has 4 section, the homepage is the ‘pokedex’ section, this section is
a list that contains all the Pokémon, including the information of the Pokémon. The
second section is the ‘news’ section. It is a page that shows the latest news of
Pokémon. The third section is the ‘chatting’ section, this section is a chat room that
users can chat with each other. And the last section is the ‘setting’ section, this
section would include something like ‘contact us’, ‘about the app’.
Function
There are three main functions in this application. As you can see, the name of the
app is ‘poke pokedex’, it’s a pokedex which store all the Pokémon information. So in
the app there is a Pokémon library, users can search for the Pokémon they want,
and in each information page of a Pokémon would display the Pokémon’s
appearance, its name, the order number, the type, its attack, defense, speed and so
on. And there is a search bar that the users can query Pokémon by their names.
The second main function is that the application would have a page that shows the
latest news about the Pokémon, like the new article, new events, all kind of news. So
users can know all the latest news of Pokémon in this application. Within this
section, user can switch between the ‘news’ pages and the ‘video’ page, users can
watch the video of Pokémon on the video page.
The third main function is a chatting section, users can chat anonymously in real
time with other users.
Target audience
The target audience of this application is players who play the Pokémon series
games and games derived from Pokémon, also the people who like or interested in
Pokémon.
Competition and Innovation
Two similar applications
There is an application name ‘pokeInfoDex’ which also is a pokedex app. Below is its
page. This app shows a list of Pokémon, the list can order by name, order by
number and type, in the info page of the Pokémon, it shows the capture, ability and
details.
However, it seems do not update for a long time, the storyboard is not fit with the
iPhoneX screen. And this app is only have one function which is the pokedex, and its
info page is a little bit messy and unsightly.
the Pokémon list page of ‘pokeInfoDex’
the Pokémon list page of ‘pokeInfoDex’
the Pokémon information page of ‘pokeInfoDex’
There is another app names ‘Pokémon Guide’, its pages are shown below. Its
function is also shows the Pokémon information, and it has a setting which can
change the app language.
The disadvantage for this app is that the navigation of the Pokémon list is so bad, it
divides the Pokémon list by type, and cannot be change, it’s hard for users to find
the Pokémon they want from the list, they can only find what they want using the
searching function.
the Pokémon list page of ‘Pokémon Guide’,
pokemon are divided into type, user can browse Pokémon list by swiping right
the setting function of ‘Pokémon Guide’
the Pokémon information page.
Innovation of my application
The two applications above are the same type as my application, we all aim to be a
pokedex to show users the Pokémon information. But there is something more than
just a pokedex inside my application.
For the innovation, my application not only have a pokedex, but also have some
network or social function. There are three main functions inside my application.
1. One function is the pokedex, which shows all the Pokémon information
2. The second function is the news section, in this page the application would
show the latest news of pokemon for users.
3. The third function is the chatting section, users can communicate with each
other in the chatting room.
So with the news section, user not only can find the information using the pokedex,
but also can get to know the latest news of Pokémon. Also users can communicate
with each other in the chatting section, so that they can share their game experience,
talk about all kind of stuff.
And here are some functions that my application may have:
1. A video section that about the Pokémon (which can be inside the news
function)
2. A social section where user can post their opinion on(which can be insde the
chatting section)
Feasibility and Technology
In this application, I will use the Model-View-Controller architecture.
Main Functions
Pokedex function
For the pokedex, the Pokémon list function, I will use the JSON of the Pokémon
information (such as the name, the weight, the height) and fetch them into the
Pokémon list.
News function
And for the news section, I think maybe I will use the wkWebView or the URLsession
methods to achieve the function, to get the news list, to get the news articles.
Chatting function
And for the chatting section, I think I will use the firebase and the open source
‘MessageKit’ to achieve that real-time chatting function.
Optional Functions
Video Function
In order to achieve the media playback function, like users can watch video about pokemon
in the application, I will use the AVKit to achieve.
Interface Design and Storyboard Mock-ups
I decided that the main colors of my app will be red and white, because these are the
most basic colors matching of Pokémon Ball, so these two colors are the best match
for pokedex. And because of the design principles of the HIG, for the consistency,
this app would only have these two colors, will not have other color to the theme.
Pokedex Section
For the homepage of this application, it is the pokedex section, this section would
show the list of all the Pokémon. I have designed two different layouts for it.
The first one is the Pokémon list would show as the collection cells, each cell contain
the big photo of the Pokémon. Users will browse pokedex based on the appearance
of Pokémon.
The second one is that the Pokémon list would show as a table view, each row
contains a thumbnail for a Pokémon. Users will browse the pokedex based on the
name of the Pokémon.
And there is a search bar in both storyboards, users can use the search bar to query
the Pokémon they want. And the tab bar below is for the user to switch between
different sections, if the users want to go to the ‘chatting’ section, then tap the chat
tab would achieve that.
These two layouts follows the rule of the HIG, they are all clarity, the text is legible at
every size, icons are precise and lucid are subtle and appropriate. I would choose
one as the final design layout.
when I click on one Pokémon, the app would go to the information page of the
Pokémon. The photo below is the layout. It would show the Pokémon’s name as the
title. And a big photo of the Pokémon would show in the center, the information of
the Pokémon would show below the photo. The information would be (type, HP,
Attack, Defense, SP. Attack, SP. Defense and the speed)