Hyundai Motor Showroom PIP Design guide
- Web/Mobile Site
In 2011, a lot of manpower were put to renewal the World Wide Hyundai Motor official website. D.FY proceed the guide design of the most large proportion of the product features. Previously, a global guide was preceded by a partner, but we had to start with new approach method and contents design rather than using existing method.
Wireframes to the Design.
Hyundai Motor Showroom page design were progressed with well-planned wireframes to make clear visual style and structure. UX and graphic designers worked very flexible in the most ideal direction, while maintaining close cooperation in the project. It certainly variables may occur, we were able to proceed very accurately as planned.
Wireframe was preceded by a partner and each of the vehicle page were divided into large sections with Highlights, Exterior, Interior, Performance, Safety, Convenience, Specification and Review. We determined the information structure volume of Main and sub-content for each section. As we composed all information in to a single page, it designed with scroll bar or util bar to see the whole contents.
Based on the most ideally designed wireframe, we found several ways to visualize the message of each contents and design effectively with appropriate style. Graphics design, infographic, icons, designs, everything had to be newly designed and 3D-Modeling by each car to create more dynamic composition of vehicle. As we make the style guide of the product page, it had produced more precisely and meticulously.
Vehicle Visual(Main Visual, Lifestyle of each vehicle)
Each features to serve the message with the point was vehicle image. So that we select the most appropriate image from the photo library and related resources that received. The chosen images were retouched more beautiful, more refined and more luxurious. As the most significant factors of each vehicle exterior and interior must be shown different concept and lifestyle, we create completely different theme that never seen before.
The evolution of the visualizing
1. Layers separately with windows, headlights, wheels and tire from the body of vehicle with adjusting the color and details. 2. Perform the photorealistic image background matching with front / side / rear view. In this process, 2 or 3 images can be sufficient, but in some circumstances, you need to complete the theme by composite the element-by-element. 3. Mask the finished images with a soft brush in order not to get the border. In this point, main object must be maintained as a separate layer or folder erase with brush naturally in opacity 20~50%.
In sub contents, we could transfered more clearly with reviving the style and characteristic features by simple interactive function. We established unique device to emphasized the style of the vehicle once more, which are the most appearance of the vehicle features that headlights, side mirrors, rear light in the visual light on / off button. 1. Graphic Features : To visualize the vehicle features, we expressed clearly and easily by highly using 3D modeling and sub graphics. 2. Dynamic Graphics : By showing image of vehicles or magnified parts, we pursue sophisticated and premium quality. Also, we approach by designing a three-dimensional composition escape from the equilibrium configuration. We've create photorealistic environment that can helps to understand the function by designing the traffic lane and vehicles movement. 3.Language of visualization : In order to give the core message of highlights in each vehicle page, we newly design the concise and effective icon.
Hyundai Motor Showroom
Gwon, Soongyu- Chief Creative director
Gwon, Soongyu- Designer
Jang, Jaehyeon- Designer
Baek, JayYoung- Designer