Interactive Design (Project 1)

 22.4.2024 - 28.7.2024 / Week 1- Week 14
Aliah Farhana Binti Mohd Fauzi / 0357957
Interactive Design / Bachelor of Design (Honours) in Creative Media

Interactive Design - Project 1

---

INSTRUCTION

<iframe src="https://drive.google.com/file/d/1YzOGgXtiU2D6he1AMxXC_j40XMdej2Wg/preview" width="640" height="480" allow="autoplay"></iframe>

Part 1 Prototype Design – Digital Resume/CV
Duration: 2 weeks

Objective: In this first part of the assignment, you
will focus on creating a UI design prototype for your digital resume or curriculum vitae (CV) using prototyping software such as Adobe XD or Figma. The UI design prototype will showcase the layout, visual elements, and user interface interactions of your digital resume.

Requirements:

1. Content and Structure:

• Prepare the content for your resume,
  including personal details, education, work experience, skills,
  projects, and other relevant sections.
• Decide on the order and hierarchy of
  sections based on their importance and relevance.

2. Layout and Visual Design:

• Design the layout of your digital resume using the chosen prototyping software. Define the placement of different sections and how they will flow together.
• Apply a consistent visual design using typography, color palette, and appropriate spacing.

3. Sections and Organization:

• Organize your resume into logical sections, such as "Profile," "Education," "Experience," "Skills," "Projects," and "Contact."
• Prioritize sections based on their relevance and significance to the position you're targeting

4. Visual Elements:

• Incorporate relevant images, icons, or placeholders that align with the content and enhance the visual appeal of your digital resume.

5. Prototype Presentation:

• Update your e-portfolio explaining and showcasing the processes of the task

Evaluation Criteria:

Your UI design prototype assignment will be evaluated based on the following criteria:

• Clarity and effectiveness of the UI design, layout, and visual elements.
• Appropriateness of the chosen typography, color palette, and imagery.

---

PROCESS

Figure 1.1 Process removing the background 

Figure 1.2 Smoothing out the edges 

In Figure 1.1 and Figure 1.2 I'm using Adobe Photoshop in order to remove the background

Figure 1.3 Starting off with my first page

Figure 1.4 Making my own checkered pattern in Adobe Illustration

Figure 1.5 Copy and pasting the board 

Figure 1.6 Starting to add up informations

Figure 1.7 Trying prototyping

Figure 1.8 Final look 

Colour Palette

After Feedbacks

Me and a few of my friends we were doing this assignments wrongly, thus during the class we showed our works to Mr Shamsul and he said we were doing it wrongly. Thus, this is my process redoing this task.

Figure 1.9 Starting off from beginning 

Figure 1.10 Still observing for layout

Figure 1.11 Final Look

Submission

Link to My CV's

pdf to my final cv's prototype

---

 REFLECTION

Creating a UI design prototype for my digital resume was a dynamic and enlightening experience. Using Adobe XD, I meticulously planned and designed the layout to ensure it was both visually appealing and user-friendly. The process began with gathering and organising all relevant content, including personal details, education, work experience, skills, and projects.

In conclusion, designing a UI prototype for a digital resume was a comprehensive exercise in combining content organization with visual design principles. The experience underscored the importance of clarity, consistency, and user-centric design in creating an effective and visually appealing resume. The observations and findings from this project will undoubtedly inform and enhance future design endeavours.