UI & Visual Materials Design
App Game for LUXGEN
This is an APP game designed on iPad for LUXGEN, a global automobile company, introducing “THINK+” system as driving-assistant functions installed in LUXGEN’s car lines. I was in charge of designing the user interface and visual materials. The first image is the homepage of the game. For it, I focused on the car and used visual elements to imply the high tech quality of this system. Players simply click the screen to enter the game.
This is the page for players choosing stages. The stage of this picture is for “Eagle View+”, a function using micro cameras to assist drivers. Players can click on the screen to start the game. Or they can also swipe for choosing other stages. The using of cameras is one of the specialities of “Eagle View+” so I displayed them and their information here as a part of my design.
This is the layout of playing. The navigation screen of “Eagle View+” shows on the bottom right corner. It is a model of the real system.
The background and routes are designed by a cooperative game development studio.
Interactive Exhibition System for Kinmen National Park
The exhibition system was designed for the museum of Kinmen National Park on a touch screen computer. The museum mainly displays exhibits about the history of Kimen, which was a battle field of Taiwan and China for 30 years.
Due to the huge amount of information, I designed the system with simple decorations and emphasize the multimedia contents. I also used textures with scratches to recall a historical memory and give an image of battle field.
At the beginning, the system shows closed, only displays photos at random. Users put their fingers on the bottom right pad, and the system seems to scan their finger prints. Then it will transform to open for using.
The video above displays how the system works. The other pictures display the interfaces of the rest parts of the system.
Interactive Exhibition System for 2010 Taipei International Flora Exposition
3D Virtual Garden:
The virtual garden was based on a real 200-year-old garden in Taiwan. For the system, I produced an animation played when the system was idling. I used Chinese traditional visual elements to illustrate the system’s topic.
I also designed the UI. My main idea was about bats, which imply good luck in Taiwan and were used in
traditional architectures. Players could click the bats on the navigator to move around while bats displayed in the virtual environment could be clicked for further
information.
Global Gardens:
Global Gardens displayed four special gardens in the world. I have designed two versions for its homepage. Finally, the one on the bottom was selected.
Interactive Photo-Taking Installation for Standard Chartered Bank (Taiwan)
The installation was designed for Standard Chartered Bank (Taiwan) and their cooperative partner, Brown Coffee, as a part of their project, which focused on the concerns of environment issues in Taiwan.
The device was installed in one of the coffee shops of Brown Coffee for players to take photos and change the background into different breathtaking scenes in Taiwan. Players could choose their favorite scene and press the “Shoot” button on the touch screen. The installation would take photos immediately and replace the original background of the coffee shop to the chosen scene automatically.
The installation was designed for Standard Chartered Bank (Taiwan) and their cooperative partner, Brown Coffee, as a part of their project, which focused on the concerns of environment issues in Taiwan.
The device was installed in one of the coffee shops of Brown Coffee for players to take photos and change the background into different breathtaking scenes in Taiwan. Players could choose their favorite scene and press the “Shoot” button on the touch screen. The installation would take photos immediately and replace the original background of the coffee shop to the chosen scene automatically.
The layout shows the electronic postcard was successfully sent.
App Checklist for LUXGEN
* I was in charge of interaction design and cooperated with Ching-Yi Wang and Sheng-Yow Li on UI design
This APP checklist was designed for LUXGEN to help sales clerks hand in cars to their new owners. For the great number of files and information, the program assists to make sure everything is done. Also, it makes the processes fun and enjoyable.
The line on the bottom shows different stages of the process chronologically. The small car will move forward to the next nod each time when clerks help customers complete a stage. Following the small car, customers’ new cars will finally arrive their home!
Black nods imply stages which have been done, white nods imply the ones which are waiting on the list, and the nod with blue glow is the stage on which users are working. Despite these stages are done or not, users can click on the nods to view contents in every stage. This allows users to know how many files they should have.
To complete a stage, clerks help customers check all the files listed on the screen as buttons. All checked buttons will be black, the next to be checked button is blue, and buttons remain unchecked are grey.
The “Back” button helps go back to redo the last file if users made anything wrong.
Here some examples of the layouts, and below are the drafts of the process I used to communicate with other designers and help to give a clear idea to clients.
Some more example pages of this App.
