The upgrade of the official website this time needs to conform to the company's style. It's difficult to achieve substantial improvement just by building upon the existing foundation, or it may not align with the company's tone. Therefore, in the early stages, I had multiple meetings over meals and coffee with the project leader (mainly for work discussions). We also tried various styles initially, including 3D, linear, and flat designs, but most of them didn't quite match the company's image, and there were uncertainties in the prototypes. This highlights the importance of thorough communication and understanding of requirements before executing the design. It's crucial not to dive into work without understanding, as it may lead to misguided efforts. Of course, there are some techniques for truly understanding requirements, but I won't delve into them here. After thorough communication and understanding, we made some attempts and finally settled on the overall style of the website: using 2.5D illustrations, restrained color schemes, and subtle animations. This greatly enhanced the overall quality and aimed to reduce the amount of information on the webpage. Through proper layout, we aimed to make the page clearer and more professional, thus gaining trust from customers more easily.

After multiple attempts and final confirmation, we ultimately adopted the concept of 2.5D illustrations, which aligns well with the style of technology and internet companies. We also expanded on relevant materials and completed a series of conceptual elements to enhance the overall design.

Furthermore, we illustrated the main banner elements for the secondary pages of each business, integrating them into various business scenarios. The prominent first-screen image occupies the most valuable real estate on the website, shaping visitors' initial impression. This image serves to effectively convey the product's value proposition and influences the overall demeanor of the website.

The illustrations' key elements were incorporated into multiple business sections of the company's website, forming an illustration library to sustain the company's design assets. This initiative helped the company reduce costs in promotional activities and operations while enhancing the professionalism of its services and fostering brand growth.

Some dynamic effects to enhance user satisfaction and reduce understanding costs.

To facilitate a better understanding of the illustration system's compositional principles, I adopted Atomic Design theory as the core framework. Atomic Design offers a clear methodology for creating the illustration system. By following the actual design process and steps, the design team can better grasp the concept of the illustration system. Atomic Design theory consists of five stages: Atoms, Molecules, Organisms, Templates, and Pages.

For this project, which was solely an upgrade of the company's website, I have compiled the design specifications specifically for the PC version. This document aims to help relevant personnel within the company understand the overall framework and details, facilitating future adjustments and significantly enhancing the scalability of subsequent upgrades.

Looking back on the entire project, it's evident that there were many challenges along the way. However, the focus remained on solving problems for the client. While there were various methods to approach these challenges, the most crucial aspect was finding the most suitable solution for the client. This aspect is where the difficulty lies and also what distinguishes between mere technique and the artistry of design.