UX designer and developer
Individual project, with feedback and requirement from professor
Responsive Website Design and Develop
Sep 2019 - Present
This project is a responsive website creation from designing to developing, with the objective raising the brand image of my professor and helping his potential students and collaborators to know more and better about him.
Delivering design ideas to the actual functional website
An online responsive website
Objective: Define problems should be solved in design process
Understanding the motivation of this project is crucial for further steps. According to my professor's requirements, he was expecting something clear, concise, but well-organized with design. Most importantly, this website should be responsive. The following are main requests of him:
Easy to maintain
Objective: Research online to explore design that meets the needs
Detail: Online research for best practice
At this point, I had to find some design that can meet the needs of my professor. Meanwhile, the design can be applied in the developing stage. I learned Bootstrap which can build responsive, mobile-first projects on the web with the world's most popular front-end component library. It is also an open source toolkit for developing with HTML, CSS, and JS. I absorbed some components that are essential to a website but easy to maintain in the future.
Navs - Clear navigation can lead viewers to go anywhere they want
Card - Card is a powerful display option for headers and footers and a wide variety of content.
Carousel - Carousel is a slideshow for cycling through a series of content, it's a optimal way for advertising
Objective: Present current design decision for feedback
Detail: Idea Generation
Using initial sketches in Adobe XD to present my current concepts to my professor. Demonstrating how proposed design meets those requirements.
Objective: Develop design by coding with HTML, CSS, Bootstrap, JS
Detail: Iterative Design
This is a long process, I met with my professor weekly and delivered my design iteratively, got feedback and made improvement continuously. Finally, the approved version launched at the end of 2019. Click the button below to the live website.
Objective: What I learned from this project
Work as a designer, but consider all stakeholders' interests. In this project, I worked as designer and developer in the same time. I couldn't proposed some complicated user interface or interaction design because it would increase the cost of development.
Enjoy working iteratively. I know sometimes iterative work would be frustrating, but I think it is do better than delivering the whole project. Learning from others' opinions can refine design ideas and save time.