Major Project: Final Project
Major Project
22/04/2024 - 02/0/2024 / Week 1 - Week 14
Darren Liga / 0351480
Major Project: Final Project
Link to Figma Prototype
Task 1
On the first day of class, we were given an overview of the Major Project, an
individual assignment that can be developed as a commercial project.. The
project is due in 14 weeks, and we're expected to begin brainstorming ideas,
which we'll present to the class next week Since the project is so important,
we were allowed to work in groups to brainstorm ideas. Working together helps
us come up with ideas faster, share different ideas, and support each other
through this challenging project. In our group, Ataka and I are handling the
UI/UX, and Clay is doing the graphic design.
Today, we started working under Mr. Asrizal’s supervision and began creating a
mood board by searching the internet for inspiration. We came up with the
brand name "Booq", an e-learning app for our client, Yudhistira. I designed
the initial logo, which is minimalistic and follows the current trend of
company logos that can be read the same way upside down. The process helped us
shape the brand’s visual identity and direction.
Fig 1.1: Booq Brand Startup
Fig 1.2: Moodboard
Fig 2.1: Flowchart (teachers)
Fig 2.2: Flowchart (Students)
We then continued to develop from wireframe to actual buttons and colors.
from there it was non stop polishing and designing and prototyping to get it
perfect for our client. The client was with us on this journey to simplify
options. We were working closely with our client and giving them the figma
prototype access to preview all our design in real time.
Fig 3.1: Figma start screen
Ataka and I worked the hardest to start the whole map of the app. As usual,
the start is the hardest and it just gets easier from there.
We then split our task into students and teachers. Ataka was responsible of
student’s page, I’m responsible for the teachers page.
After halfway of the whole ui design, i find teachers section to be slightly
harder to ui/ux than students. As i would need alot of upload and edit
pages.
Fig 3.2: Homepage Design
We agreed to use main color red for student, Blue for teachers.
Fig 3.3: Teachers - upload assignment
Fig 3.4: Teachers - Book section
At the final stage of developing. We found a slight problem with our navbar.
“book” section wasnt needed for teachers as teachers wont be uploading them
nor reading them.
Fig 3.5: Old Nav Bar (book middle)
Fig3.6: New navbar (Book icon removed)
Fig 4.1: Prototyping for interactive flow
Fig 4.2: Assignment flow
Fig 4.3: Quiz Flow
Fig 4.4: Homepage Flow, Live Chat
Final BOOQ Deck
Reflection
Working on the "Booq" e-learning app was both challenging and rewarding. Our
team, guided by Mr. Asrizal, collaborated closely from start to finish. We
began by creating the brand name and logo, which set the tone for the entire
project. This experience helped us apply our skills in a real-world setting,
where we learned the importance of teamwork, regular client communication,
and refining our designs through an iterative process.
Observations
Collaboration was crucial to handling the project’s challenges. Splitting
tasks between UI/UX and graphic design worked well, though we found it
tricky to keep everything consistent between the student and teacher
versions of the app. The teacher's section, in particular, was more complex
and required careful planning. Regular feedback from our client was
essential in improving our designs, and the ability to adapt quickly was key
as we moved from wireframes to the final product.
Findings
Designing for different users (students and teachers) taught us the
importance of creating experiences that fit each group while keeping the
overall design consistent. Early prototyping in Figma helped us spot issues
and improve the app’s usability. Using different colors for each user group
(red for students, blue for teachers) worked well for clarity and branding.
The project highlighted the need for thorough planning, efficient design
processes, and a good balance between looks and usability.
Areas for Improvement
In future projects, better planning from the start would help, especially in
mapping out the user experience. Streamlining complex features like those in
the teacher’s section would save time, and more frequent client check-ins
could catch issues earlier. Balancing design with functionality is also
important—ensuring that the app looks good without making it harder to use.
These changes could make the design process smoother and more effective.
Comments
Post a Comment