Interactive Design - Project 1: Prototype Design

18.9.2023 - 2.10.2023 / Week 4 - Week 6

NieWeiqiu / 0350928 / BA of Design (HONS) in Creative Media

Interactive Design

Project 1
INDEX:

1. Project 1
2. Feedbacks
3. Reflection

LECTURES

Project 1: Prototyping

We will create a UI design prototype for our digital resume or resume (CV) using prototyping software such as Adobe XD or Figma.

1. Research

I found some examples of resumes by looking on Google and I will observe their layout and background, including contact information with five to six profile pictures, about me, work experience, educational background, skills, etc.

 1.Research on Digital Resumes


 2.Research on Digital Resumes

 3.Research on Digital Resumes

 4.Research on Digital Resumes

2. Sketch

After some research, I used my iPad to sketch the layout of my digital resume. I created five different layout sketches.

1.Sketches


2.Sketches

3.Sketches

4.Sketches

5.Sketches

3. Adobe XD

This is my first-time using Adobe XD and I am not familiar with its layout. I created the canvas according to the ratio of (1366x2993)
I'm going to use sketch 5 because it looks more interesting and aesthetically pleasing

Process 1

My desktop will use blue and white as the main colors for the resume. Because blue and white collision looks harmonious will.

Process 2

I started using my new drawing board and started drawing a digital resume from my sketches and digitizing it. First, I started drawing boxes along the grid. 
I entered the title (my name) as I drew it in the sketch. I chose Garamond - Bold as the font for the title

Process 3

After that, I added other content such as profile picture, projects, awards and contact details to my resume. I made the font of the headings bold and put a small mark in front of each heading.

Process 3

I'm adding a navigation bar to this digital resume. Added text mark in upper left corner. It is a LOGO with the name I designed before. Then add the names of other subtitles in the upper right corner.

#First Try



FEEDBACK

Week 5 / September 25, 2023

A digital resume must have more than 5 sketches because for the first few sketches we tend to follow references more. Don't make it too complicated, because we need to make it a real website in the next task.


REFLECTION

Project 1 was a great experience for me to dive into UI/UX prototyping software for the first time. Analysis of the original website was something I had done in a previous class exercise, as was the wireframe model. While both tasks required a lot of thought, it was no different than anything I'd done before. However, using Adobe XD for the first time is a completely different experience. I had to read a ton of tutorials to learn the basics of the software, and even then it took me a long time to figure out all the necessary tools. Once I got a good grasp of the tools, the whole process felt much smoother and more efficient, but it definitely took a lot of time to get to this point. I also learned more about the intricacies of landing page design.




Comments

Post a Comment

Popular posts from this blog

Immersive Visual Effects

Image
23.9.2024 - 14.10.2024 (Week 1 - Week 4) NIE WEIQIU/ 0360239 / Bachelor of Design (Hons) in Creative Media / Taylor's University Immersive Visual Effects Task 1 / Pre-production INSTRUCTIONS Fig. 1. Module Information Booklet Pre-production According to the teacher's further explanation, I roughly understood it, so I wrote three ideas PPT introduction After receiving feedback, I finally thought the idea of ​​forest was good, so I continued to use the idea of ​​forest. Final Thoughts Week 2 Exercise: 3D Camera For this exercise, we just had to learn how to use and experiment with using the 3D camera feature. We were given an After Effects file and we had to use it as a template and animate it.  https://youtu.be/eKh4FhTSVNk Project 2 Introduction: Produce 3D block-out pre-visualization. • Produce 3D elements and effects block-out • Composition nesting and layer breakdowns • Timing and transition confirmation • Style frame for final look and feel • Composition ready renderin...
Read more

Design Research Dissertation

Week 1 - Week  NIE WEIQIU / 0373215 Design Research Dissertation  Bachelor of Design (Honours) in Creative Media / Taylor's University INSTRUCTIONS Final Submission Task 1: Dissertation draft Task 2: Visual Design Publication Task 3: Final Dissertation and Turnitin Submission Turnitin Submission Final Dissertation KREATE google drive FEEDBACK Weekly Progress Reflection Sheet.docx REFLECTION Throughout this module, I went through three key stages: drafting the research paper, designing the visual publication, and submitting the final paper. In the initial phase, I reviewed a wide range of literature, gradually clarifying my research topic and objectives, while also learning the fundamental methods and structure of academic writing. During the visual publication stage, I worked on transforming academic content into a visually engaging publication. This not only deepened my understanding of layout design but also enhanced my ability to organize and present information effectively...
Read more

Information Design - Exercise

Image
  6.2.2024 -  / Week 1 - Week  Nie Wei Qiu / 0360239 / BA of Design (HONS) in Creative Media Information Design Exercises 1 - 2 LECTURES Week 1 / 6.2.2024 In the first week, the teacher introduced us to the entire module, and also introduced us to exercises, electronic portfolios and projects.  We have to prepare a presentation on our first week with our group too, one of the first topics we have to prepare is to find out the different types of infographics and we are going to use a free online infographic tool to reframe a poorly structured piece of information  infographic poster. Group Task (FLIP Presentation) FLIP 1: Types Of Infographics Individual Task (Re-design Infographic Poster) I started by doing some research on infographic posters on Pinterest. I found a few posters and analyzed them.I found a poster that I thought was problematic and reworked it Infographic Poster from Pinterest I think its structure is a little too crowded and I want to chang...
Read more