Interactive Design - Project 1: Prototype Design
Ting Wen Yi / 0361799
Interactive Design/Bachelor of Design (Hons) in Creative Media
Project 1 : Prototype Design
INSTRUCTIONS
Part 1 Prototype Design – Digital Resume/CV
Duration: 2 weeks
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.
PROJECT 1 : PROTOTYPE DESIGN
Part 1 Prototype Design – Digital Resume/CV
1. Research and Inspiration
 |
| Figure 1.1 Mood Board - Week 4 (22/9/2023) |
I started by searching for example CV designs, and I also had some ideas I wanted to implement. I aim for simplicity and readability because, from my experience, I know that recruiters only spend about 5 minutes per CV, especially when they have many to review. Furthermore, I want my design to leave a lasting impression on the recruiter so that they remember my CV. I've created a mood board to help guide my design.
 |
| Figure 1.2 Notes - Week 4 (22/9/2023) |
I researched a recruiter's perspective on CVs for designers to understand what makes a good CV. After conducting my research, I compiled a list of the content I should include in my own CV.
Content:
a. Profile
I am currently pursuing my degree and am a motivated and enthusiastic individual with a strong interest in the design industry. I have experience in interior design and a track record of successful project management, consistently delivering quality outcomes through effective leadership and team motivation. I am actively seeking a part-time position to apply my knowledge and experience.
b. Personal Details
- 013-213 4047
- tingbernice@gmail.com
- tingwenyi.blogspot.com/
c. Work Experience
IGCSE Invigilator (May - June 2023)
Wesley Methodist School (International)
-Supervised students during exams to maintain the integrity and security of the testing process.
- Set up exam rooms, distributed exam materials, and collected completed exams.
IGCSE Invigilator (Oct - Nov 2023)
Wesley Methodist School (International)
- Checked student identification to ensure compliance with exam rules and regulations.
- Responded to student inquiries and provided assistance as needed during exam sessions.
Interior Designer Intern (Oct - Dec 2021)
White Panel Studio, Petaling Jaya, Selangor
- Created appealing and comprehensive mood boards to present to prospective clients
- Produced creative and detailed design of residential interiors using AUTOCAD, 3DMAXs
- Attended site inspections and took notes of interior design ideas, themes, concepts, and spatial layout.
d. Skills
- Adobe Illustrator
- Adobe Photoshop
- Adobe Premiere Pro
- Adobe Indesign
- Adobe After Effects
- 3DS Max
- Figma
- AutoCAD
e. Languages
- Malay
- Chinese (Mandrin)
- English
f. Education
- Taylor's University (Bachelor (Honors) of Design in Creative Media)
- First City University Collage (Diploma in Interior Design)
- Metro Learning Centre, Batu Caves (IGCSE)
g. Project
Maybank MyTIGER Values Art
2. Layout Draft
 |
| Figure 2.1 Layout - Week 4 (22/9/2023) |
I created five different layout drafts to plan my design. In the first layout, I placed my contact information at the end. However, after conducting more in-depth research, I realized that it would be more effective to place my contact information at the top, especially with the portfolio link. I rearranged the most important elements to the top and placed less crucial information at the bottom. I believe that my second draft is more practical and will have a better impact.
3. Figma
 |
| Figure 3.1 Figma Progress 1 - Week 4 (23/9/2023) |
I used Figma to digitize my CV since I couldn't download Adobe XD due to maintenance issues. I began by creating an A4-sized page and then followed the draft from my second version, carefully placing my details. Having prior experience in creating CVs, I knew exactly which details to include. To maintain consistency, I also incorporated colors from the mood board I had previously planned.
 |
| Figure 3.2 Figma Progress 2 - Week 4 (23/9/2023) |
After adding more details, I quickly realized that I had little to no space for my profile summary where I had originally intended to place it. However, I had plenty of space in the left column. So, I quickly change my plan to shift my name and profile picture to the left side and position my profile summary at the top.
 |
| Figure 3.3 Figma Progress 3 - Week 4 (23/9/2023) |
To maintain consistency, I include skill level indicators for my language proficiency alongside my other skills.
 |
| Figure 3.4 CV First Attempt - Week 4 (23/9/2023) |
Second Attempt
 |
| Figure 3.5 Color Reference - Week 4 (29/9/2023) |
I am in the process of crafting my resume, and I've decided to infuse it with vibrant creativity. I plan to employ a multicolor background, with orange as the primary color, to inject energy and visual appeal into my resume. This approach will not only make my resume stand out but also reflect my distinctive personality and style.
 |
| Figure 3.6 CV Refining - Week 4 (29/9/2023) |
 |
| Figure 3.7 CV Second Attempt - Week 4 (29/9/2023) |
For my second attempt, I changed the picture to my portrait, and I have also updated my 'Interests' section to 'Projects.' Additionally, I aligned projects with skills to create a more consistent and organized presentation. I also change the color theme to match my background.
4. Final CV Design
Figure 4.1 CV Final Design - Week 4 (29/9/2023)
Figure 4.2 CV Figma Prototype - Week 4 (29/9/2023)
FEEDBACK
Week 4:
Find a nice portrait picture. Align 'Projects' with 'Skills'.
REFLECTION
My first experience creating a CV with Figma was a positive and educational one. It taught me about design principles, attention to detail, and the importance of presenting my skills and experiences in a visually appealing and well-structured manner. I look forward to applying these lessons not only in crafting future CVs but also in other design and communication projects.
Comments
Post a Comment