UX Design: Compilation and Reflection

(Week 1- Week 14) 29.03.2022 - 02.07.2022

Yu Dawei / 0344780/ BDCM

UX Design: Compilation and Reflection


INSTRUCTIONS: 

Task 1: Infographics

For the first task, we were instructed to create infographics of a given set of data. Here is the 2 infographics we designed for the data.


Task 2: Web design tools

We were told to research and come up with a presentation of different tools and softwares which are used in web designing. 


Task 3: WebsIte Analysis (MyCEB)

This task is based on the client we are to work with. We were required to do a background analysis to understand the brand and their website.


Task 4: Developing Wireframe

For this task, we need to redesign the website that myCEB gave to us. We need to redesign the layout. Below is the first attempt:


Below is the presentation of our design for the first attempt.


When we show the website design to Mr Asrizal, he said our work is too much similar with the original template. So we just change the color of the website, add new fonts and redesign the layout. 

Here is the second and final attempt:


Below is the pdf of the final design:



Task 5: Imagery

For this task, each group were given a set of pages to find imagery. The imagery has to be related to that specific page and look relatable to the ideas and content.

These are the images we found below which suitable with the topic:



Final task: Mobile responsive site

For the final task, each group were given a set of desktop web pages of MyCEB wireframes to be redesigned for mobile sites. We need to redesign the layout and the size of the words.

Here are the desktop site wireframe links provided to us:

1. Contact Us: 

https://xd.adobe.com/view/0ad81024-e848-4461-8bef-3290d4947da0-5f8b/

2. Destinations:

https://xd.adobe.com/view/8301143e-f155-422b-832c-9983d2c28e48-d652/

3. Happening Now: 

https://xd.adobe.com/view/448777c7-0b50-4d8a-93a6-ff705056ba1c-11d4/

4. Why Malaysia: 

https://xd.adobe.com/view/2cb1bc69-34b5-406e-aca9-9fdf17965659-79e2/

To change the size of the template from PC to mobile. We need to change the layout of the templete first and then change the font size, our group decided to change the font size to no more smaller than 16pts.

This is the comparison with PC templete and mobile version. 



Below are the wireframe links to the final redesigns of the 4 pages:

1. Contact Us: 

https://xd.adobe.com/view/b85bd0cf-a243-4f5e-a412-68da216514d3-ed08/

2. Destinations:

https://xd.adobe.com/view/0597e5ee-8102-47e0-b5fe-0c505dac2be3-50c4/

3. Happening Now: 

https://xd.adobe.com/view/d343a68d-d2ad-42d9-b5e9-bfde6b996597-8610/

4. Why Malaysia: 

https://xd.adobe.com/view/dcdc9702-ab12-49f7-8d8e-f59f6f07c4b2-898f/

Final presentation PDF: 



REFLECTION
UX Design was an interesting module. I learned a lot from web design and how to use Adobe XD. However, the module usually has some issue with the client side. There were a few weeks that there's nothing updated by client side and we just need to wait and do nothing, and we just going to be a bit confusing what do we need to do exactly to finish up this module. Luckily, this module don't need us to do coding, we just need to put the images to the existing myCEB template that lecturer gave to us and submit thats all. It is also a good experience of learning of how to find image properly which suit the templates that lecturer gave to us.

评论