G1 Week 7: Colour Palette, Word Map, Body Storming

Main Colour Palette :
To reduce the complexity of reading, yellow text was used on top of the neutral grey background as a form of highlight and method to captivate the attention of its users.

Fig 1. Main Colour Palette
#ffed51   |   #4a4a4a   |   

In this mobile application, it aims to mitigate the crowd we observe around popular eateries/ foodcourts in school. One may navigate around NTU to find alternatives and discover different types of food located all over campus.

Capacity & Vacancy Word Map

The purpose of the word map was to visually show the capacity of the various food locations around school as well as the rough location in the NTU shaped area.  More importantly, our group derived a mechanism to discourage people from visiting over populated canteens. As the canteens fill up in real time, the word opacity would change and disappear as the canteen becomes filled (full). This way, users would not get a chance to see filled canteens and over populate the place.

More Images: https://drive.google.com/open?id=0BwDNxcZKJYE6bS1pY0hkOGxoU3M

The application supports the ability to allow a slider to show different timings of the breakfast, lunch and dinner crowd. At first glance it shows you the map of the timing you are currently belong to.

Localised Map

The mobile application features localised maps to navigate users based on where their GPS pings their location to be. In addition to a location dot, we added a directional arrow to show where users are faced to reflect a directional location dot on the map.

Also, to improve the navigation experience, we added the videos to be played back at every point of turning point so that users get a better sense of where they are headed to visually. Videos are speed up for quick viewing purposes.


Bus Routes (Campus & SBS)
We wanted to provide a good set of information for people taking busses on campus by mapping out all the available busses in a single navigating map. Colours of the various campus busses were coded accordingly. As for the SBS busses, we made use of the orange and red colours of SBS to represent bus routes 179 and 199.

Physical Signages
– uniformity
– logo recognition

Unfamiliarity of the campus buses often led to with the food places around campus, we wanted to encourage

Best of all, it shows you the different routes available all in one app!

Body Storming
During body storming, we found the ideal font size and typeface to use for the appropriate signages. It was important that we tested out our research as reality might differ from the data (researched overseas). As we did the body storming session,


G1 Week 6: Initial Sketches and Designs

Initial Sketches

Initially, our team came together to do basic sketches for the mobile application prototype. We wanted to find out the different screens which were projected to be designed. As our discussion goes on, we mapped out the possible issues of basic usability and user experience flow.


 Mobile Application Icons 

The first step of icons which we had developed were a series of illustration done from images. Upon seeking for feedback, some users told us that the illustrations were too detailed for small icons. It was important that we took scale into account as it would be small showing up on the mobile screens. As such, our group discussed to work on icons with fewer details, emphasising on the highlights and shadows.

 Mobile Application Icons #02

As some test users observe, the revised mobile icons are now more recognisable. We made use of colours that are often associated to the cuisines to help users identify the icons quicker. We used lesser visual elements to make sure that it was not too complicated to the eyes.

G1 Week 5: Field Research In NTU

Observational Note #01

During our field research, we took listed down the stalls available at each canteen or food area to include in our food map.

An interesting finding that we took note of was the opening hours of different stalls. This would be rather problematic because people might look at the overall canteen opening hours to look for food in the area. However, upon reaching the location they would find out that a particular stall opens at a different timing compared to the rest.

As such, it was important for us to take this into account when mapping the food places in NTU.

Solution: Map individual stall timings based on research rather than using the overall opening hours at a canteen.

This solution allows user to know what food is available during a specific timing rather than being overloaded with irrelevant data in a generic search function.

Field Research
Canteen Two Stalls:

Economic Rice | Shandong Big Bun | Sichuan Cuisine | Yong Tau Foo | Korean Cuisine | Xiao Long Bao | Chicken Rice | Ayam Penyet | Indian Cuisine (closed) | The Oven | Kath’s Bakery | La Kopi




North Hill Stalls:

Claypot & Porridge | Western Cuisine | AH Boon’s Fish Soup | Chicken Rice |Nasi Padang & Indian Cuisine | Fishball Noodle | Yong Tau Fu (closed) | Traditional Dough Fritters and Miniwok | Mixed Veg Rice | Drinks/Fruit




North Spine Stalls:

Mini Wok | Yong Tau Foo | Chicken Rice | Hand-made Noodles | Mixed Rice | Cantonese Roast Duck | Fruits and Juices | Western food | Soup delight | Indian Cuisine | Malay BBQ |Vegetarian food




NIE Canteen Stalls: 

Vegetarian (closed) | Nasi Padang (closed) | Muslim Food (closed) | Chicken Rice | Ban Mian & Fish Soup (closed) | Fruit (closed) | Snack and Soft Drinks (closed)| Sandwiches and Salad Bar | Western food | Noodle (closed) | A-la-carte (closed) | Chinese Food (closed) | Indian (closed)



Canteen 13 Stalls:

After 7 Bakery | Japanese Cuisine | Chinese Cuisine | Western food | Korean Cuisine | Noodle delight | Drinks and fruit / Pau





Canteen 14 Stalls:

Muslim Malay | Taiwan | Si Chuan | Asian Food Delights | Ban Mian Fish Soup | Fruits and Beverages





Observational Note #02

In addition to that, we realise that there were different levels of <basement one> as we move around NTU. In NS2.1 basement 1 might be below ground level, but in NS1.1 basement might be three levels above ground level. This made way finding extremely difficult as the basic navigational skills did not apply in this context of searching for L1, L2 etc.

Observational Note #03

The third point we took note of was the different signages located around school. In different areas, signages were designed differently. This made us confused with the fact that we had to way find and look for the appropriate signages at the same time (cars, pedestrians, different building signages).

Observational Note #04

Video On Routes:




Lastly, we acknowledge that there are various routes around school and for members in school, we all have different agenda when moving around campus. One main factor we identified was the difference in campus routes as well as the difference in walking path by students. One might move along the sheltered walkway but take a longer route or take a non sheltered walkway but a shorter route. We identified that the main purpose of our project was the disperse the crowd and so, we allowed target at two ways to get to a canteen. 1) the nearest canteen option (shortest route) and 2) the shortest queue option (least waiting time).

Field Research

As we went on the busses, we tried to look at the landmarks that were prominent. We noted that the bus brought us to most of the food places and decided that we could implement it onto the food map concept.

G1 Week 4: Embarking On Project One Maps Design

Design Issue

Food in the Singapore culture is extremely prominent and the campus food availability is observed to include a wide selection. However, it seems that during peak hours certain canteens are over populated while the others remain quite empty.

Design Solution

Our group decided to come up with a food map, with the purpose of creating a clear view of the food places around NTU. Possibly with the purpose of mitigating crowd during peak hours by diverting the human traffic to less crowded areas.