INTERACTIVE DESIGN ✿ PROJECT 1 ✿
INTERACTIVE DESIGN ✿ PROJECT 1 ✿
18.09.23 - 02.10.23
week 4 - week 6
✿ TAN JIA JIA 0350577 ✿
Bachelor of Design (Honours) in Creative Media
✿ LECTURE ✿
Refer to
Exercises.
✿ LECTURE RECAP ✿
During Week 4, Mr. Shamsul briefed us about Project 1, which focuses on Prototype Design. He emphasized the importance of including a clear and concise headline on the assignment page, describing the website's purpose. The document's page size is set to a width of 1366 pixels, and he instructed us to follow the presets in Figma or Adobe XD for consistency and alignment.
1. Content and Structure: Students need to prepare the content for
their resumes, including personal details, education, work experience, skills,
projects, and other relevant sections. They should also decide on the order
and hierarchy of these sections based on importance and relevance.
2. Layout and Visual Design: The assignment involves designing the
layout of the digital resume using chosen prototyping software. Students are
expected to define the placement of different sections and how they flow
together. They should apply a consistent visual design using typography, color
palette, and appropriate spacing.
3. Sections and Organization: The resume should be organized into
logical sections such as "Profile," "Education," "Experience," "Skills,"
"Projects," and "Contact." Prioritization of sections should be based on their
relevance to the targeted position.
4. Visual Elements: Incorporating relevant images, icons, or
placeholders that align with the content and enhance visual appeal is
important.
5. Prototype Presentation: Students are required to update their
e-portfolios to explain and showcase the processes involved in completing the
task.
The evaluation criteria for this UI design prototype assignment include
assessing the clarity and effectiveness of the UI design, layout, and visual
elements. The appropriateness of typography, color palette, and imagery will
also be considered. Additionally, the evaluation will take into account the
realism and meaningfulness of user interface interactions, consideration of
responsiveness for different screen sizes, and the overall presentation
quality and clarity of the design rationale.
✿ INSTRUCTION ✿
Figure 1.1 MIB
✿ PROJECT 1 ✿
RESEARCH
Before beginning the design process for Project 1, I conducted thorough
research to ensure that the position I'm targeting is well-defined and
aligned with the project's objectives.
Figure 2.1 Research from Internet
SKETCH
Figure 2.2 Sketches
Following Mr. Shamsul's guidance, I produced a set of five design
sketches. This approach allowed me to gain a more comprehensive
understanding of the project's scope and options. These sketches were
instrumental in helping me make an informed decision about which design to
proceed with when transitioning to Figma.
FIGMA
After completing my sketches, I employed the Figma platform recommended by
Mr. Shamsul. His tutorial on how to navigate Figma, coupled with the
provided size specifications, proved invaluable as I began translating my
design concepts into digital form. This combination of practical
instruction and appropriate tools facilitated a smooth transition into the
digital design phase of the project.
Figure 2.3 Figma Screenshot
Before diving into content editing, my initial decision was to arrange all
the headers. This deliberate step allowed me to establish a clear and
structured framework for my project. By having the headers in place, I
could easily identify and navigate through different sections, providing
me with a solid foundation for the content editing process. This strategy
ultimately contributed to a more organized and user-friendly project
layout.
Figure 2.4 Figma Screenshot
Following the organization of headers, I proceeded to seamlessly integrate
all the previously prepared content, aligning it with the respective
headers. This systematic approach ensured that the information I had
documented in the provided documents flowed logically within the
designated sections.
FINAL OUTCOME
✿ REFLECTION ✿
Project 1 has been an insightful and rewarding endeavor. From the outset, the
emphasis on planning became evident as I sketched multiple design ideas to
make an informed choice for implementation. Learning to proficiently use
Figma, thanks to Mr. Shamsul's guidance, marked a significant milestone in my
digital design journey. The meticulous structuring of headers and content
organization not only enhanced the overall user experience but also
facilitated a smoother design process. Integrating content from my
documentation into the digital format forced me to consider effective
presentation in a digital medium, balancing aesthetics and readability.
Details like typography, color schemes, and spacing came into sharp focus as I
progressed. Ensuring responsiveness for various screen sizes was a valuable
skill honed during this project. Lastly, documenting and presenting my design
rationale in my e-portfolio underscored the significance of clear
communication in the design process. Overall, Project 1 has been an
educational and enriching experience, solidifying my grasp of essential design
principles and techniques. I look forward to applying these insights in future
projects and continuing my growth in digital design.
Comments
Post a Comment