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   |   
#1f1f1f

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
-recogizable
– 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,

 

Week 5: Visual Research

Existing Event Promotional Posters 

A study of existing promotional posters designs, rationale and design applications.

Reference Poster Design #01: 

Communicate: In this poster design, it aims to communicate an energetic and fun marathon event. Stating informational details that relates to the event. The picture driven poster also depicts the outcome of the event after participation.

Emotions: Exited | Joy | Anticipation

Reflections: The overall approach on this project looks fun which deviates from the usual marathon events. Enticing its audience to sign up for the event.

Visual Interest: Image driven poster shows a burst of colour pigments, with people raising their arms. Seemingly having fun. The bolded text in white contrasts to the colourful background. While its texture reminds me of the actual event with powder pigment.

Reference Poster Design #02: 

Communicate: Encourages people to walk by foot with the illustration of a shoe. the trail at the bottom shows a series of gifts which reflects the rewards which you would get upon finishing the 10,000 steps. With a good slogan “make every step count”.

Emotions: Excited | Friendly | Attractive

Reflections: The hierarchy in this poster design shows how a well placed illustration and text communicate its message well.  The illustration and text ties together well and provides sufficient information to the audience. The footwear with the street view allows me to better look at the 10,000 steps challenge accomplished though our daily activities (walking down the street).

Visual Interest: The yellow and blue bold choices of colours speaks to its audiences while retaining the ease of reading. The lifted shoe signifies the beginning of a step, driving an action taken by its viewers. Also, the line of action (footpath) guides the eyes to see the subdominant information.

Reference Poster Design #03: 

Communicate: Informative poster on preventive measures of fighting dengue. A call for action.

Emotions: Urgency | Importance | Seriousness

Reflections: The good use of colour really captivates my attention and eyes to flow along the red objects which are the main points of the poster.

Visual Interest: The short and sweet caption (4 words) sends the message across while making it memorable at a glance. Its bold text and contrast against the background allows it to be easily readable from far. Red alert on the main caption and images directs the eyes at what is important within the poster design.

Overall Reflections

All in all, it was interesting to look at how existing poster design have been successfully implemented. Learning from them, I looked at how I could embark on creating my own design. Applying the knowledge of colour, and visual hierarchy.

Week 5: Develop Slogan & Moodboard

Brainstorm Map

Keywords which I had derived were the words happy, fun, rainbow, hearts, caring volunteers, freedom. Of which, I chose to work with the idea of Arts & Hearts to derive the three slogans from below.

Proposed Slogans

#01 Arts On The Groove

Grooving is associated with a dance movement to jazz. I wanted to portray the performing arts side of arts as well as the fun factor in the programmes. Having people come together and have fun.

#02 Artsy Funsy

Derived from Artsy Fartsy, it is catchy as people mention Artsy Funsy. Also trying to bring out the fun factor within the slogan. I wanted a familiar slogan which does not seem too crude in the hospital environment. Hence the modification to the slogan.

#03 Arts From The Hearts

It is important to note that the center of this programme harness on the efforts of the caring volunteers. Also, the participants who go through the art programme gets to channel their artistic side from the hearts. Which got me thinking of this slogan Arts From The Hearts, that could represent both the care given by the volunteers as well as the expressive arts from the participants hearts. 

Of all the three,  I decided to go with #03 Arts From The Hearts as it best represented the programme spirit and what I was trying to achieve.

Concept Sketches

#01 Art & Hearts

Brush and palette motif

Asymmetrical placement

Playing with negative spaces

 

 

 

 

 

#01 Art & Hearts

Brush with a red paint dipped tip.

Red tip also shows a heart motif

Asymmetrical placement

Good line of motion with the brush directing the eyes

 

 

 

#03 Art & Warmth

Designed to show warmth from the sun

Visual hierarchy as focus is being on the slogan in front of the sun

Pencil and patch work motifs that doubled up as craft suggestions

 

 

 

 

All in all, I decided to go with the third concept as I wanted to play with the idea of paper cut texture to represent the craft side of the programme. Feedback was given that the poster had to show the music or performing arts side as well.

Moodboard

The mood I wanted to give was to show was mainly the caring side of the programme as well as the art approach that value adds the journey. Most importantly, I wanted to use the texture of paper cut because this would set the overall concept for the poster design such that at one glance, people could tell that it is an arts programme.  

The choice of typeface were to be script or something along the lines of scribbled words while retaining the legibility. This is to harmonise with the overall design concept which I was proposing for.

Reading : Atmospheres By Peter Zumthor

Reflections

In this reading, the author, Petev Zumthor, gave a valuable insight towards his perspective on the question : 

“What do we mean when we speak of architectural quality?”

–   Peter Zumthor

He critics the issue that quality does not simply deal with how a design has attained historical mention, or getting into a publication. Instead, it touches on the topic of how a good design addresses both the tangible and intangible aspects.

 

It got me thinking does quality design equate to timeless design?

 

Where it would not be affected by the changes in society or time. This idea relates closely to a Chinese term “耐看”which simply means the ability to withstand careful appreciation well worth a second look. Impressed by how some designs had such appeal, its inherent presence seemingly moves him every single time. His answer to this profound theory of good design was its atmosphere. Bringing up the importance of first impressions.

 

“I enter a building, see a room, and – in the fraction of a second – have this feeling about it.”

–   Peter Zumthor

 

His reference to music also revealed an interesting thought that, architectural design could also move people at first sight. An instinctive reaction we have when we enter an atmosphere not only helps us to survive. The secondary effect of this unplanned emotion allows us experience quickly the appreciation or rejection towards a space.

An example of this would be the reference to people suffering from claustrophobia. Where spatial perception of a tightly arranged room evokes a sense of uncontrolled stress.

Atmosphere considers all aspect of arrangements. Not only the fittings placed in a space, but also the afterthought of placing a square versus round table. Could a round table encourage better sense of social cohesion?

Zumthor recognizes that people, air, noise, sound, colours, material, texture and forms, all contributes to an atmospheric experience. He pushed boundaries beyond spatial elements and even discussed about the user’s contribution. Through feelings, expectations that every individual defines the atmosphere differently. Where beauty is in the eye of its beholder.

Redefining a user as a spatial element. Where one has to go through a space and this experience is unique to a user in a specific moment. This is impossible to replicate for another user because they would view this experience differently.

This thought made me think, could this physical aspect ever be replaced with a virtual experience? Maybe not in the next few days that this could occur, but in the near future, it is interesting to look at how technology could value add an atmospheric experience.

A very relevant discussion would be how museums are starting to conduct their exhibits in both physical and virtual spaces. One example would be the NTU Museum where the guest speaker (10.09.17) Ms Faith Teh shared on the existing virtual exhibitions now available for viewing online.

However, during class discussions I came to learn that this virtual experience does not overtake or replace the physical exhibitions. Instead, we should see them as a new experience and approach where we experience from another perspective. This time without using all 5 senses. (No touch, smell, taste) only through sight and maybe hearing to pre-recorded sounds.

All these effort of creating an atmospheric experience encourages us to think about the work behind-the-scenes. The author shares that he finds it consoling thinking back on the great deal of work which had gone into such creation. From processes to the very moment a design is actualized.

There are nine aspects that the author reveals in his writings on his concerns and the way he goes about things when generating an atmosphere for one of his buildings previously.

The Body of Architecture

The material presence of things in a piece of architecture. The appreciation of how the design is a contribution of material that comes from different parts of the world and combines it in a space. These materials may sometimes be concealed or vague but it all gives meaning to a space.

For example, the concrete walls and floors we see in school are indeed intentional. I remember stepping into ADM for the first time and felt a sense of rawness to the classroom interiors. This feeling was later confirmed to be true as I was told by a faculty member that the artist had a concept for students to always come to class with means to grow and improve. The idea of Work-In-Progress. That everyone was A Work-In-Progress.

Material Compatibility

Material reacts with one another. Each of it has its own unique outcome when being treated differently. With one material, one could explore the countless possibilities. Placing elements near or far from each other creating a good balance of presence and weight. Again, when we look at ADM’s Sunken Plaza the area outside basement 1. We see an intended area filled with water. This water reflects the overall building and skies, painting another picture. Also, the intention of creating the building majestic presence within the Sunken Plaza. If one stands in the middle of this space, you would hear water streaming through the pond, feeling overwhelmed by the surrounding structure and with the glass panels all around, the place visually seems even bigger. When you look on the surface of the water, you would see the building once again. This interplay of material and elements in this atmosphere creates a greater picture for the user to experience.

The Sound of Space

With an interior being an instrument, collecting and producing sound. The way materials are being organized, shaped and directed would create an intended sound. Even silence is an intention. An example of such structures would be present in the auditorium. Have you ever wondered why is it carpeted? Or how could these rooms produce pin drop silence? Well let me explain. The auditorium walls are being covered with acoustic panels that diffuses or absorbs noises through material composition. Noises like whispers and echoes are being eliminated to create a serious atmosphere for talks and lectures. Carpets placed on the ground also minimizes the reflection of sound to create a pin drop silent surrounding.

The Temperature of a Space

All buildings have an intended temperature for the ideal atmosphere. The mood it sets for the overall experience. Walking through a friend’s house, I came to realize the marble flooring, after feeling cold feet on my first step. This inherent property of marble flooring keeps your feet cooled even on a hot day. This coldness brings out a lavish lifestyle not for everyone. For one might not be able to afford such material under their feet or simply do not appreciate such feeling. This changes our perception of the space, perceiving it to be a luxury when compared to the heat we experience outdoor every day.

Surrounding Objects

The collection of things present in a space. Some things come together to form a warm and caring space. For example, a recent visit to IKEA showed me this significance. The showrooms are designed to portray our ideal homes, with our own touch. The rooms are furnished with beds, tables, shelves and lamps. All these evoking a warmth and homliness for iconic things such as a bed brings us into a state of comfort.

Between Composure and Seduction

Architectural design is a form of temporal art. Where things structured spur a reaction or direction. Some placements are designed to seduce a user towards certain temptations. Or even letting go, granting freedom in places like hospitals.

The next story I would like to share would be how malls are structured. Escalators are often in a certain direction so that people would have to walk past some shops before getting to their destination (on upper floors). This generates foot traffic and also the seduction required for the malls to thrive.

While in a classroom setting, the placement of doors are usually limited to one with it right at the corner of the room (like the room we use for spatial design classes). This discourages people from leaving and its feels just right to sit in the classes.

Tension between Interior and Exterior

It was extremely insightful as the author reveals that the architect’s job does not end at building a box. The box is not only multi-faceted but it contains an interior. This is where interior design takes place. Within this interior, there are products, furniture and fittings that generate the overall design. The transition between indoor and outdoor, through a door or window. That feeling of being engulfed by a structure that now you are inside it. It is what is keeping us together within one single space.

There are also things that could be revealed or concealed as intended. The glass exterior at ADM reveals certain parts of the interior as visitors walk by. However, certain concealed areas builds a sense of mystery or solitude (Eg. Library exterior covered by trees and bushes allow people inside to focus and receive the silent treatment within the library, being undistracted).

Levels of Intimacy

The proximity and distance generates a feeling of association and disassociation. Scale and dimension. A temple structure is very often built much taller than an average man. Reason being that temples are meant to be the house of God(s) holding the idea of ‘higher presence’ and being worshipped. As such a exalted entrance is often being placed at the front whereby people who enter the temple would feel its presence. When you enter, you feel the warmth of people around. Inviting you with the constant chanting repeated as a calming factor. A complete different feeling from which you first enter the temple, as they prep you to quieten your heart and soul.

The Light on Things

Kazaguruma (Pinwheel) by Toshiyuki Tani

The way light presents itself to the viewers. Be it a completely dark room, with light seeping through the door gaps as a glimmer of hope or a bright room with chandeliers.

In Japanese designs, the Japanese studies at how thoughtfulness goes beyond simply light. But also how light creates shadow. Reminding me of a good read, In Praise of Shadows by Junichiro Tanizaki. Speaking of the Japanese delicate taste indesign.

The idea of Architecture as surroundings brings out how a building is not alone but part of a neighbourhood, a city, a nation. That people would create different experience and memories through what you have developed. A story to tell.

As a student majoring in product design, I see how this stays relevant in my scope of interest. How things are manipulated to evoke a feeling in someone. Maybe a product that grows with the user, maybe one that evokes a feeling in someone. Touching their hearts. This reading was extremely interesting and relatable for anyone. Creating a revelation to the buildings we might see around us. 

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:

https://drive.google.com/open?id=0BwDNxcZKJYE6RkdlMDBQc25nVFk

https://drive.google.com/open?id=0BwDNxcZKJYE6YmF2aTNJaGU4cW8

https://drive.google.com/open?id=0BwDNxcZKJYE6LS1TSm0zdjRfamM

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.

Week 4 : Presentation Preparation

Final Presentation Process

In my final presentation, I prepared a set of explanatory cards along with a prototype of the final badge. This way, I could see how the badge look in real context and support my explanation during the my presentation.

In addition, I placed the badge onto an image of the volunteers. Allowing others to see how my designed badge looks in context.

Chosen Design #01 B&W
Chosen Design #01 Greyscale Chosen Design #01 ColourFinal Design

With both fonts tested out, I had preference for the second design. The fonts are easier to read at a distance while it complements the overall design.

Chosen Design #02 B&W

 

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.

 

Week 3 : Project One Digital Translation & Exploration

Digital Translation

During the translation of design, I did various arrangements and constantly got feedback from another person to see if my concept was retained after translation. Some parts were rather weak as it was a little cryptic and the message was difficult to decipher. Placement of objects were key but arrangement in terms of motifs facing upwards or downwards also played a part in creating the image which you want to portray.

The brush and palette icon was selected for final development. As I studied how the brush should be placed in order to show a fun spirited icon with the splashes as well as the torch/brush liberty message. The brush facing downwards did not seem to be successful as it did not show as a torch. Instead, it was simply a brush and palette motif at one glance.

Concept Development

Being a little stuck at the idea of a palette and brush, I decided to break out of its form and explored with the possibilities of a painted area rather than restricting its form to a palette. With a dripping painted block, I was able to captivate the viewer’s eyes to look at the words Art On The Move. However, the brush did not seem to be eye catching and memorable at this moment. I observed while going through the edits that the logo was weak when the words are removed. Hence, I continued to work on the logo motif trying to achieve the idea of a motif that spoke for itself.

I looked at how negative spaces could suggest closure and did different arrangements to look at dominant and subdominant figures. An S shaped palette was included to make suggestion of a line of motion. It was important that the text harmonised with the logo design and does not dominate the concept. Also, the many splashes seem to be complicating things and I worked on how I could retain just one drop of paint splash while retaining its efforts of suggesting movement.

Colour Palette

Colours were chosen and implemented onto the final design. It was difficult to determine which colour to use as too many tone or shades might not go along with the aesthetics of the logo design. As such, I looked at how I could work around complementary colours with reference to the vest colour theme. In addition to that, I looked at how different colours had its own representation and meaning behind it. In relation to the concept, I chose three colours that represented therapeutic, fun and liberation. 

Typography On Logo

Exploration of fonts were tested out on the final form. Serif fonts were easier to read while script fonts represented the organic form of creation. Varying font size showed the focus of the phase, with ART on the MOVE. Offsetting the ‘O’ upwards gives the word an upward lift when reading it as well. Typography in this context isn’t simply typing within a box.