INFORMATION DESIGN - EXERCISES

on

7.01.20 - 17.01.20 (Week 1 - Week 2)
Piyaphon Inthavong (0337589)
Information Design
Exercises

INSTRUCTIONS

LECTURES

Week 1:
January 7th, 2020

As an introductory day to Information Design, the lecturers briefed us through the module and have asked the class to form into groups of four for us to work together in future tasks and projects. Our lectures will be taken place via the FLIP classroom learning style. Students of differents groups are to prepare lectures for the class regarding their weekly topics.

 Mr. Kannan provided the followings slides to introduce us not only to the Information Design subject itself, but the complete exercise-assignment brief of the module.




January 10th, 2020

 The first FLIP topic was Manuel Lima’s 9 Directives Manifesto. We prepared the following slides and presented first as group 3A.

Week 2:
January 14th, 2020

During the beginning of the second week, Ms. Anis have explained to us and clarified the FLIP learning system to the class. Our next FLIP topic is the L.A.T.C.H structure, which can be seen in most infographics because it helps communicate its information to the audience efficiently and interestingly. The L.A.T.C.H system organises information according to its location, alphabets, time, category, and hierarchy.

 January 17th, 2020

The following slides about the L.A.T.C.H system were presented in class:

EXERCISES

Exercise 1: Quantifiable Information
7.01.20 - 10.01.20 (Week 1 - Week 2)

The goal of this exercise is to turn the data we have collected from the sets of buttons into an organized form of information through an A4 sized infographic poster. As the first day, we were given time to draft and plan the final look of the infographic poster and to finalize the poster for submission for the next class.

Figure 1.1. Categorised buttons.

The first things to do after receiving our selected group of buttons is to separate them into categories of our choice. I have chosen to separated the buttons according to their sizes, holes, and the textures (marble and matt).

Figure 1.2. Final layout.

The idea behind this layout is to make the poster look like a shelf where people can quickly see which size they want by looking at the huge size label from each row. The 2 textures were separated by the colours, while mini descriptions and the amount in numbers were provided for each group of buttons.

 Exercise 2: L.A.T.C.H
10.01.20 - 13.01.20 (Week 2 - Week 3)

 The objective of this exercise is to design an A4 size infographic poster of Pokémon monsters based on the L.A.T.C.H principles. We were given choices to make a selection on any generation of our preference to display its detail in a creative way. As a classy type of person, I have chosen the Hoenn region from Pokémon Ruby and Sapphire to work on. 

 The following were the 4 Pokémon I have chosen to make research on for the infographic poster:

Figure 2.1. The four chosen Pokémon.

Figure 2.2. Details of the chosen Pokemon in table.

 As one of the classic Pokémon players, I've decided to create a modernised Pokémon map based on the original game map structure. The photo below is a quick sketch of the Pokémon map I want to work with.

Figure 2.3. Quick sketch of the layout.

To further preserve the originality, I have extracted most of the key elements from the game as shown below:

Figure 2.4. Hoenn Region Town Map.

Figure 2.5. Game scene- pixelated 2D graphic style.

Figure 2.6. Town sign from the original gameplay.

Figure 2.7. Real in-game locations of the four Pokémon.

 One of the first Pokémon games started off even before the year 2000 and the company have maintained their pixel art style for the rest of their 2D game platforms not before their recent 3D graphics. Their 2D pixels art was a very important art style to consider for the poster.
Figure 2.8. Sketches on different versions of the information cards.

While designing, I always keep in mind that regardless of the look and the art style, designs are not usable when their forms/functions are not prioritised before the aesthetics. This means I have to make sure all details are clearly shown with proper hierarchy and user friendly for the audience, especially Pokémon players. To ensure that the labels are clear, the town signs are to be differentiated from the rest of the titles, while the names and the evolution of the Pokémon were separated according to their specific sections/shapes.
Figure 2.9. Different layouts of the poster style and composition.

 Once the final layout was confirmed, I collected all the assets and quickly jumped into Adobe Illustrator to get started with the digitization process.

Figure 2.10. Digital tracing of the map.

Figure 2.11. Information card variations.

Figure 2.12. Information card variations.

Figure 2.13. Poké types icon variations.

Figure 2.14. Pixelating the map vector.

Figure 2.15. The process of pixelation at pixel-stitch.net.

To pixelize the graphics, I exported all the assets individually and used the pixel stitch tool from pixel-stitch.net to obtain a similar effect I wanted. Further alteration was made with the image tracing tool to simplify and acquire the desired pixelized graphics.

Figure 2.16. "Recolor Artwork" creates color variation of the graphic assets.

Figure 2.17. Pre-final composition.
The final version of this poster was finished off by eliminating the dark colored ocean on the edges. The huge color difference creates an unwanted contrast, hence a distraction to the eyes and to the information cards on the right side.

Final outcome of the Pokémon L.A.T.C.H poster.

Comments

Post a Comment