Blog: Visual Language
ITPG-GT 2005-001
Tutor: Su
WEEK 6
Part I:
Choose 1 topic of your interest and design a desktop and mobile layout.
Final:
Interaction:
For the desktop version, tap the "water" in different language to change language of the page. Tap NOW to enter to see the details.
For the mobile version, swipe the first "water" line to select the desired language in center to change language. And same with tapping NOW to see the new page of details.
Working process:
So the story was simple: water saving.
Contrary to the traditional methods of putting some serious pictures or putting on some diagrams/data, I prefer to present it in a way that easier for the users to see, and be more motivated to really clicking in and using the page, in terms of aesthetical layout.
The idea actually came very quickly and my first draft was almost the same structure with the final:
.jpg)
I kept most of them, and changed the left-top corner from some non-sense to a useful place which is formed by different words of "water" in a varies of languages. There it's a more playful and visually appealing way to change language for different users, and indicated that the topic of "water" is a global issue.
So next I got a clean paper, and tried different ways of handwriting, as well as the brush stroke of a drop of water.
.jpg)
.jpg)
_edited.jpg)