Zhi Jun's work

A3: Client Website Week 10: Reference Study Week 11: Basic Website Structure Week 12: Website Development Week 13: Website Interface A3 Summary Through the creation of a client website for a clothing brand, I have further honed my web design skills, particularly in the areas of e-commerce functionality, visual aesthetics, and brand consistency. By integrating seamless navigation, responsive design, and engaging content, I effectively translated the brand's identity into an appealing and functional digital presence. This project allowed me to demonstrate my ability to cater to client needs, ensuring a user-friendly shopping experience while maintaining a strong visual impact that resonates with the target audience. 

Lecture This is the last lecture of this semester. Unlike previous lectures, this one mainly allows other students to share their respective client websites. Through their presentations, I can understand the differences and design styles between websites from various industries. This will greatly enhance my perspective and indirectly improve my understanding of website design. During this semester, I realized that the difference between website design and graphic design is not very significant. In the design process, we go from preliminary research to sketching and then gradually enter the formal design phase step by step. Therefore, after studying the website design course, I will be more confident in meeting client requirements in the future, especially regarding website design.

Practical  Welcome Page Create a minimalist welcome page interface. Use a variety of photos to convey the brand's concept effectively. Include a scroll-down feature that allows users to explore the brand's archive for more information. Achieve Achievement is a key characteristic of this brand, highlighted through various secular articles written about it. Users can click on the pictures to access more information. Shop The webpage features a lineup of branded clothing items. When users hover over a piece of clothing, the back design is displayed, allowing them to preview both the front and back without clicking. This helps users browse and see the complete design of the items easily. For those who are truly interested, clicking on the item will provide detailed information, such as size options and material specifications. Poem The webpage features a dedicated section for poems, reflecting one of its unique characteristics: sharing life-themed poems on their social media, speci...

Practical Original Webpage Design In the past, when designing a web page, I would start from the homepage. But this time, I began with the poem section first. This is because, since this is a client website, it does not depend solely on my design concept. I needed to start designing from the simplest part to better understand the website's design perspective. This time, the design is based on Rotten Paradise's original concept and has been improved to make the overall webpage more complete. The original poem webpage design featured a relatively simple layout, but there were a series of problems, such as the layout being too boring. Therefore, through a chaotic yet orderly layout design, the content can remain clear and understandable while also enriching the webpage's design. The About and Content pages did not undergo significant changes, as we maintained their original minimalist design style. Modify Version Poem Page                 ...

Practical Flowchart The importance of flowcharts for web design has been understood from previous design experience. Therefore, a clear flowchart can serve as the foundation of a website and help the designer create a structured design during the design process. Sketches Sketches can help designers formulate the desired design style and layout. At this stage, the designer can sketch all ideas on paper, allowing them to be reviewed repeatedly in subsequent design steps and further improving the initial design of the website. Low-Fidelity Wireframe The step of preparing low-fidelity wireframes involves converting the previous sketches into a digital format. Naturally, there will be some differences between the two, as sketches are intended to guide the general direction of the design. This does not mean that designers need to adhere strictly to the sketches. High-Fidelity Wireframe Once the low-fidelity wireframes are confirmed to be problem-free, designer can proceed to the next step: c...

Practical https://crossoverconceptstore.com/ Using large-area iconic photos as the main design can attract users' attention to the greatest extent and indirectly convey the brand's message and concept to users. It should be noted that there is no need to add too many fancy design elements on the homepage because the focus is on the photo. Therefore, a simple UI design on a large area of photos will better display the photo content to users. In addition, you can still add other services or content that need to be promoted to users in the homepage design. This ensures that the content is conveyed to users and also indirectly reduces the number of webpages, preventing users from choosing to ignore the content due to an excess of webpages when browsing. https://www.meandem.com/ A simple yet informative design style is very consistent with our client's original website style. Highlighting the product content through basic black and white can indirectly guide users, encouraging t...