15/12/25 - 04/01/26 / Week 1 - Week 14
Brendan Fedya / 0376283
Application Design I / Bachelor of Design
(Hons) in Creative Media / Taylor's University
UX Design
TABLE OF CONTENTS
I. LECTURES
➼ An App you love, and why?
WhatsApp is the app I used most often in my phone, and I do quite like it a lot. Instead of having a lot of features, I felt this app did the opposite — it only focuses on the content, and enhancing the usability aspect which is messaging.
➼ What is market research?
We need to understand market needs, size, competition and the fit (specialized/niche or not). In a team of business and design, we are responsible for conducting user research to identify user needs easily and make sure that the product will cater to their demands.
Find other competitor's core feature , find the thing that they are weak at — and use it as our core feature.
We need to breakdown a task of a process (in this case, the experience of the business proposal), in order to understand which points could be improve on.
➼ How about user research?
We need to understand user's needs, feel that you are the users, and what do you think you need in the experience. One weakness that we have is that we always have assumptions towards something — and this could be summarized through our knowledge towards the environment. Assumptions can only replicate a solution that has already existed.
And to break down asumptions, user research is needed.
Find other competitor's core feature , find the thing that they are weak at — and use it as our core feature.
We need to breakdown a task of a process (in this case, the experience of the business proposal), in order to understand which points could be improve on.
➼ More into user research
Firstly ask, who are the customers, and what to they need and want? We asked these questions to connect the dots and identify the root cause.
Problem statement constantly change, the first one we made is our assumed problem. It must answer 5W1H,
User interview should aim for answers that we don't expect. Ask what problems are they experiencing, not what they want. Questions should go beyond yes and no (asking what,how, why), but get ready to get back on track when neccessary.
➼ Synthetize Research
Data that is only mentioned one or twice may only be point of interest, but may also be just noise. The data that is always mentioned should be prioritize. Sometimes, you may also feel something is missing—draft more research to cater to your instincts.
➼ User Persona
Is a character with certain characteristics so we can put ourselves in their shoes and understand their problems and frustrations. A persona may represent more than 1 person's interview data. User personas are not supposed to make the readers think and assume further.
After I statements, create a total of 3 personas. 1 main persona supported by 2 secondary personas. The main persona should represent 80% of the common goals and needs from all the interviewees.
➼ User Scenario
Put the persona in scenarios, show their goals, needs, and frustration in the scenario. Give them crisis. After that create a journey map for them.
➼ Ideation
Ideas can come from anywhere, brainstorm as many ideas as you can do, and select it later. In a diverse group, each individual have different unique experiences that may trigger different set of ideas.
How Might We questions, when we're deciding on this, we must flip it around. Example if someone is anxious in their journey, how do we convert it into excitement instead?
➼ Project Management
Frameworks:
1. Waterfall, do steps one at a time.
2. Agile, basing on customer feedback, test, deploy, review, and redesign.
3. Lean, work at being most efficient to maximize value, but lose flexibility and fragile to unplanned events.
Use SMART goals, which are quantifying KPIs to achieve on the stipulated timeframe. Then use RACI framework to delegate each tasks.
ART DIRECTION
use the base of 3d character, then paint over it so it looks 3d
for ui, photobash the assets.
➼ Usability Heuristics
Users expectations must be proven right.
1. Visibility of system status, should show which steps the users are in every time in the app. Predictability and control translates to better decision making.
2. Match between system and the real world
e.g. how icons and the words used in apps resembles things that we usually use in real life
3. User control and freedom
e.g. Allow users to undo/cancel an action.
4. Consistency and standards
There are no reasons to change standards practices (e.g. search bar is always on top)
5. Error prevention
As how the name suggests, give extra confirmation steps whenever there's anything unusual from the usual user flow. Also, could have error prevention for high circumstances actions.
6. Recognition rather than recall
e.g. remember their favorites, remember search history, personalize things based on user preferences.
➼ UI principles
Use design principles to build your UI.
Center alignment vs optical alignment. Sometimes things needs to be readjusted from center alignment as thee negative spaces in objects vary.
Making an app that is unconventional, requires us to give onboarding hence users are on the same page as us when navigating through the app. For existing users, can give reminders, updates, when they are not using the app already (e.g. showing the basics again) for quite some time. When screen becomes inactive we can do (e.g. showing them guide because we imply they might not know how to navigate through.
Contrast for app should be 60% whites, 30% different shades of tone in between, 10% of highlight.
Contrast could be created through spaces, colors, sizing. To differentiate within the same colors, borders, or highlighting can make it stand out.
Ergonomics—frequent used buttons should always be near the finger.
Intuitivity—any element that is introduced, should reuse it. Any element introduced will make the app more complicated. For example, a mechanic in a game you only use once.
➼ Decision Fatigue
Decision fatigue can come from too many options. So when offering options to clients, reduce it as much as possible. Decision fatigue strips out mental energy, and makes us unable to process risk and rewards correctly.
Habits form through pleasure. These are 4 stages to hook people:
1. Trigger, things that remind users about the product.
Hence we should know, what does the user really want? And how do we bring that in to our product?
2. Action, when trigger is met with motivation and ability.
If you have lower energy, you will go to short-term benefits, If you have higher energy, you will consider more towards the long-term benefits.
Hence how do you make your options lower energy than other alternatives, so it actually favors your own preference? This will help users get back the loop.
3. Reward, it brings impact on the users. Could be external which is through social standing or approval from a community. Or internal, personal mastery or an ability or a betterment for self.
Make people feel good about themselves, and how to apply this seamlessly in our product. They are most likely to make action.
4. Investment, rewards are cumulative towards a goal. Hence, the time and effort spent became worthwhile, and this reinforce previous choices.
➼ Portfolio and its best practices
Don't be hesitant to show bad projects also, it could showcase our learning curves, storytelling, and also thinking process throughout our journey.
We want to make them see our potential in their company, and how to match it to their own workflow.
Include only specific contributions from group projects.
Give them estimated time needed to read the portfolio.
Give context why does our project matter? either to the audience or to even to the clients.
Show that people are enjoying our product, because eventually these products are used by humans. It will resonate with them better.
Show functions of the product, starting from the significant ones.
Show what is does batter through comparison and data.
Show our project improving over time, and how our project is not perfect nor a smooth ride at first. But this comes after you have presented the work. People are more interested in the process after they are interested in the work.
Organize our projects, be flexible, give portfolio variations that shows different focus on each variation.
Dont explain the process, explain the results when using the process.
➼ Class Tutorial: AI Critique Student Designs
For this task, we are asked to reflect back on our final project of the first Application Design module, insert it into generative AI to gain professional-level feedback.
‣ Week 11
This week I made some changes in the lo-fi prototype, and I don't stick to the sketch that much anymore. I sketched a 3 colum
For that, I took a screengrab of my MUJI app redesign home page:
 |
| Figure 2.1: MUJI redesign - homepage screengrab. |
This is the feedback I gained and analyzed after inserting it into Generative AI:
1. Visual Hierarchy
While the 'sale banner' appears contrasting, it is too visually aggressive. It causes viewers eyes might not comfortably flow down to the "events" and "for you" sections. A good layout guides the eye naturally from the most important element down through secondary and tertiary information.
2. Accessibility
Placing thin, white text over a busy background photograph—even with a heavy red color overlay—creates contrast issues. Users with visual impairments or those viewing the app in bright sunlight might struggle to read the smaller dates or the "*online exclusive" text.
 |
| Figure 2.2: Sale banner design. |
The heart (favorite) icon on the "for you" card is floating quite close to the edge of the image. Standard accessibility guidelines (like WCAG) recommend a minimum tap target size of 44x44 px. Ensure interactive elements like that heart icon have enough invisible padding around them so users don't accidentally tap the product image when trying to save the item.
The icons in the bottom navigation and the top header are very thick and heavily weighted. Modern UI—especially for a brand like MUJI, which is famous for its extreme minimalism—tends to favor a strict adherence to a crisp line-art style. Switching to thinner, uniform line-weight icons without heavy fills will immediately modernize the interface and make it feel more elegant.
4. One Suggested Big Fix
Redesign the hero banner. Instead of a red-tinted photo of a busy store aisle, try using a completely clean, neutral background (like an off-white or light gray) with high-quality, minimalist product photography. You can announce the "40% OFF SALE" using crisp, stark typography—perhaps just black text on that neutral background, or a very refined, minimalist monochromatic badge. This will instantly align the app with a high-end, professional aesthetic and fix your contrast issues simultaneously.
Feedback Challenge:
Based on the feedback I gained, I decided the question the hero banner feedback. My reason to create a visually heavy hero banner is to draw viewers attention to that page — as based on user research, people tend to interact with sale products more than regular products when navigating through an app. And if I made it look less visually contrasting, it might weaken the effect that I intended to give.
You are confusing "visual noise" with "visual hierarchy." Right now, the banner is shouting. It definitely gets attention, but it does so at the cost of the user's visual comfort and the brand's identity.The challenge for a professional designer is to create that exact same level of contrast and priority, but to do it elegantly. You want to command attention, not demand it.
Here is how a professional
designer simplifies a high-priority element like a massive sale without losing
its functional impact:
1. Contrast Through Whitespace
(Negative Space)
Contrast isn't just about bold
colors; it's about difference. If the rest of the app has products and text, a
massive block of empty space immediately draws the eye. Instead of slapping a
heavy color multiply-effect over a busy store photograph, place the sale
announcement over a completely clean, neutral background. By stripping away all
the surrounding clutter, the user's eye has absolutely nowhere else to go but
your message.
2. Typographic Scale and Weight
You can make a banner feel
incredibly urgent and prominent purely through typography. A stark, oversized,
heavily weighted "40% OFF" in black or dark gray against an off-white
background is highly contrasting and impossible to miss. It retains the
functional goal of grabbing attention but feels incredibly modern and
sophisticated.
3. Strict Silhouette and Line
Art
If you want to use graphic
elements to frame the sale—like a tag or a badge—keep them brutally simple.
Avoid any 3D effects, gradients, or shading. Rely on strict line art and pure,
monochromatic silhouettes. A crisp, black-and-white graphic draws the eye
through its sharp geometry rather than overwhelming the user with a wash of
aggressive color.
4. High-Contrast Photography,
Not High-Contrast Overlays
If you must use a photo for the
hero banner, use a single hero product shot beautifully against a minimalist
backdrop. If the photo itself is clean and high-contrast, you don't need to add
an artificial red layer on top of it to make the white text readable. The text
will naturally pop if the photography is art-directed correctly.
Back to the question:
●
Did the AI catch something your teacher missed?
I believe it did, my
teacher did not question my choice of creating a visually heavy hero banner to
create contrast and emphasis. One thing he did mention in the AI feedback is
that contrast and emphasis does not necessarily come from a heavy strike of
colors, even unusual empty spaces could draw the viewers attention.
My teacher also
mentioned that my design has already followed MUJI’s brand identity very well.
But AI feedback recommends some improvements to make it better, thinner
iconography, strict lineart, and sharp geometries could enhance it futher.
●
Do you agree with the AI’s critique now that you are looking
at your work months later?
As for this, I
felt that I needed to try it out myself, and conduct user research again. It is
true that the hero banner caused slight discomfort when navigating the app
after, but I felt the tradeoff is much more worth it compared to the
disadvantages. A way to work this around could be utilizing negative spaces as
a point of emphasis, which will not sacrifice discomfort for the viewers. As for
brand identity, it is true that it could be improved even further, iconography
just felt off because I used icon templates rather than creating the design myself.
➼ Class Exercise: Flutterflow
Trying FlutterFlow and its AI features that could be used for this module.
 |
| Figure 2.3: Sale banner design. |
c
III. FEEDBACKS
‣ Week 11
- Monetization can be benefited from the vendors that pay more, they get better placements on the app (the top)
- Don't create grids first. Create cards, and then arrange it, then settle the grids. Its like you wont know which rack to put on if you dont know what books you have.
(Feedback from teammate)
‣ Week 12
- Put icons on our shops (e.g. non halal logo etc the ones that people use often)
- Logo that represent the shops from we first look at it on the map
- Highlight activity bar, so we know where we are right now.
- Main features need to be more highlighted, Estimated waiting times, queueing numbers (e.g. now how many queue in line)
- Another home page after an order has been created. How to highlight that the order is urgent? Orders countdown attached to the navbar for example.
- (Feedback from teammate) Put numbers on orders
- mimic shopee orders, where we put shop name so we can go back to order from that restaurant again(Feedback from teammate)
- Cut down quantity popup
‣ Week 13
- 35 mins estimate on the restaurants page should be on another layer to signify importance.
- Use QuickEase logo instead of taylors logo
- Add payment page after confirming order as an extra layer of error prevention. People will be more cautious during paying.
- Your queue and customers in line should be more emphasized.
- Logo that represent the shops from we first look at it on the map
- Highlight activity bar, so we know where we are right now.
- Main features need to be more highlighted, Estimated waiting times, queueing numbers (e.g. now how many queue in line)
- Another home page after an order has been created. How to highlight that the order is urgent? Orders countdown attached to the navbar for example.
- (Feedback from teammate) Put numbers on orders
- mimic shopee orders, where we put shop name so we can go back to order from that restaurant again(Feedback from teammate)
- Cut down quantity popup
IV. REFLECTIONS
With this, we have concluded our studies in this module. It was a long run, and to be honest, I struggled nearing the end. I feel that the closer we got to the later weeks, the more difficult the tasks became, especially as there were more assignments from other modules.
On top of that, Sir Sylvain provided a lot of reflections, and he consistently related what he taught to real industry practices. He applied the principles he taught to his own work as well. Through this, I was able to find relevance in what we were doing, and I felt motivated to complete the assignments even though there were many tasks to manage. One thing that really stayed with me is the importance of having good behaviour when working, as what we do in class reflects who we will be in the industry later on. With a good attitude, people are more likely to be willing to train you, even if you are less proficient on the technical side.
My only regret in this module is that I lacked proper time management skills, which caused me to fall behind in my project progress and prevented me from seeking feedback on time. I hope that in the upcoming modules, I can significantly improve my time management, as this is a bad habit that I should not continue, and it will affect everything I do in the future if left unresolved.
Overall, this module brought me many new insights that I was previously unaware of regarding the design industry, and I am truly grateful for that. I hope that in the future, I can apply these lessons more consistently, grow both professionally and personally, and perform better in managing my responsibilities across modules.
Final words, I would like to sincerely thank Sir Sylvain for his patience and guidance throughout these 14 weeks. This module challenged me and pushed me to reflect on my own habits, mindset, and growth as a student, and I hope your reminders about attitude and professionalism will stay with me when I'm going to do more demanding projects later on in the future. Thank you for believing in us and pushing us to do better!
Comments
Post a Comment