To showcase the art history app design, I created a comprehensive case study that includes all design process stages from user persona to high-fidelity prototypes using Figma. I also added brief descriptions of each step along with visuals to make it easy to follow.
The case study will be available on my personal website and social media accounts, where I share my design projects and experiences.
FoodToast is a regional food delivery service opearted in more than 500 Indian cities. FoodToast aims to define upraise the quality of life and experience of urban consumers by offering the convenience of food ordering and delivery and overall experience.
Designing User-Centered Digital Experiences
Explore the process of designing intuitive and engaging digital experiences during this presentation. From conducting thorough research and analysis to understand user needs and business goals, to creating wireframes, prototypes, and final interfaces, this process is designed to create user-centered solutions. Learn how a focus on the user drives each step and leads to successful digital products.
FoodToast is a regional food delivery service opearted in more than 500 Indian cities. FoodToast aims to define upraise the quality of life and experience of urban consumers by offering the convenience of food ordering and delivery and overall experience.
Designing User-Centered Digital Experiences
Explore the process of designing intuitive and engaging digital experiences during this presentation. From conducting thorough research and analysis to understand user needs and business goals, to creating wireframes, prototypes, and final interfaces, this process is designed to create user-centered solutions. Learn how a focus on the user drives each step and leads to successful digital products.
Google UX Design Course - Portfolio Project 1 - App Design for a Fictional St...AnandGopalakrishnan8
This is my First Portfolio Project that I made as a part of the Google UX Design Course. I worked on this project from July to November 2022. It is a design for an e-commerce app for a fictional shop selling sports equipment/clothing.
PDF Submission for Checkux prototypes vs wireframes.pdfpetter son
In this comprehensive blog post, we will delve deep into the world of wireframes and prototypes, understanding their unique characteristics, benefits, and when to use each one.
Designing user experience (ux) for digital productsVijay Morampudi
User experience design isn’t just moving pixels; it’s much bigger than solely the user interface (UI). You should start considering the entire customer experience: the full life-cycle of your customer’s experience across every channel, digital and non-digital. Evaluate every touch point, and redesign each one as necessary to meet your customer’s needs. The theme of this talk is how to define User Experience (UX) for digital products
Key takeaways
• Applying Design Thinking to UX
• From touch points to end-to-end experiences
• User research and Analytics to identify Personas and pain points
• Journey mapping
• Wireframing from lo-fi to hi-fi
• Usability and A/B testing
The Methodology of a Trustworthy User Interface Design Agency.pdfZazz
The designers of user experiences may keep their attention on resolving the issues faced by users by maintaining an attitude of empathy throughout the design process by the UX design company.
Visit here: https://www.zazz.io/ui-ux-design-agency.html
Watch recordings of engaging talks, like my recent guest lecture at Vellore Institute of Technology, where I covered Interaction Design models, Interfaces, and the impact of AI on UX research and UI designing. Join me as we explore the fascinating world of design and technology, and discover how they intersect to create innovative and user-centric solutions.
Lecture recording YouTube link - https://www.youtube.com/watch?v=WdMV7Z-oAtk
I covered following topics-
* Interaction Design
Design Models - Cooper's Goal-Directed Design & Double Diamond model
Types of Interfaces - GUI, Voice, Gesture-Based Interfaces & Zero UI interfaces
How Ai is helping a UI/UX designer?
UX/UI & Ai -
Chat GPT - For user research, copywriting, user flow & persona creation
Mid Journey & Firefly for image creations
Musho.ai for quick landing page
Other tools - Font Joy & Font Pair, color.adobe.com, uizard.io
Video Ai - Text to video, Image to video & Video to video
"Ai will not replace you, but the person using AI will…"
Top 5 Indian Style Modular Kitchen DesignsFinzo Kitchens
Get the perfect modular kitchen in Gurgaon at Finzo! We offer high-quality, custom-designed kitchens at the best prices. Wardrobes and home & office furniture are also available. Free consultation! Best Quality Luxury Modular kitchen in Gurgaon available at best price. All types of Modular Kitchens are available U Shaped Modular kitchens, L Shaped Modular Kitchen, G Shaped Modular Kitchens, Inline Modular Kitchens and Italian Modular Kitchen.
Google UX Design Course - Portfolio Project 1 - App Design for a Fictional St...AnandGopalakrishnan8
This is my First Portfolio Project that I made as a part of the Google UX Design Course. I worked on this project from July to November 2022. It is a design for an e-commerce app for a fictional shop selling sports equipment/clothing.
PDF Submission for Checkux prototypes vs wireframes.pdfpetter son
In this comprehensive blog post, we will delve deep into the world of wireframes and prototypes, understanding their unique characteristics, benefits, and when to use each one.
Designing user experience (ux) for digital productsVijay Morampudi
User experience design isn’t just moving pixels; it’s much bigger than solely the user interface (UI). You should start considering the entire customer experience: the full life-cycle of your customer’s experience across every channel, digital and non-digital. Evaluate every touch point, and redesign each one as necessary to meet your customer’s needs. The theme of this talk is how to define User Experience (UX) for digital products
Key takeaways
• Applying Design Thinking to UX
• From touch points to end-to-end experiences
• User research and Analytics to identify Personas and pain points
• Journey mapping
• Wireframing from lo-fi to hi-fi
• Usability and A/B testing
The Methodology of a Trustworthy User Interface Design Agency.pdfZazz
The designers of user experiences may keep their attention on resolving the issues faced by users by maintaining an attitude of empathy throughout the design process by the UX design company.
Visit here: https://www.zazz.io/ui-ux-design-agency.html
Watch recordings of engaging talks, like my recent guest lecture at Vellore Institute of Technology, where I covered Interaction Design models, Interfaces, and the impact of AI on UX research and UI designing. Join me as we explore the fascinating world of design and technology, and discover how they intersect to create innovative and user-centric solutions.
Lecture recording YouTube link - https://www.youtube.com/watch?v=WdMV7Z-oAtk
I covered following topics-
* Interaction Design
Design Models - Cooper's Goal-Directed Design & Double Diamond model
Types of Interfaces - GUI, Voice, Gesture-Based Interfaces & Zero UI interfaces
How Ai is helping a UI/UX designer?
UX/UI & Ai -
Chat GPT - For user research, copywriting, user flow & persona creation
Mid Journey & Firefly for image creations
Musho.ai for quick landing page
Other tools - Font Joy & Font Pair, color.adobe.com, uizard.io
Video Ai - Text to video, Image to video & Video to video
"Ai will not replace you, but the person using AI will…"
Similar to Case Study - Design an Art History App for an Art Gallery.pptx (20)
Top 5 Indian Style Modular Kitchen DesignsFinzo Kitchens
Get the perfect modular kitchen in Gurgaon at Finzo! We offer high-quality, custom-designed kitchens at the best prices. Wardrobes and home & office furniture are also available. Free consultation! Best Quality Luxury Modular kitchen in Gurgaon available at best price. All types of Modular Kitchens are available U Shaped Modular kitchens, L Shaped Modular Kitchen, G Shaped Modular Kitchens, Inline Modular Kitchens and Italian Modular Kitchen.
Can AI do good? at 'offtheCanvas' India HCI preludeAlan Dix
Invited talk at 'offtheCanvas' IndiaHCI prelude, 29th June 2024.
https://www.alandix.com/academic/talks/offtheCanvas-IndiaHCI2024/
The world is being changed fundamentally by AI and we are constantly faced with newspaper headlines about its harmful effects. However, there is also the potential to both ameliorate theses harms and use the new abilities of AI to transform society for the good. Can you make the difference?
Book Formatting: Quality Control Checks for DesignersConfidence Ago
This presentation was made to help designers who work in publishing houses or format books for printing ensure quality.
Quality control is vital to every industry. This is why every department in a company need create a method they use in ensuring quality. This, perhaps, will not only improve the quality of products and bring errors to the barest minimum, but take it to a near perfect finish.
It is beyond a moot point that a good book will somewhat be judged by its cover, but the content of the book remains king. No matter how beautiful the cover, if the quality of writing or presentation is off, that will be a reason for readers not to come back to the book or recommend it.
So, this presentation points designers to some important things that may be missed by an editor that they could eventually discover and call the attention of the editor.
White wonder, Work developed by Eva TschoppMansi Shah
White Wonder by Eva Tschopp
A tale about our culture around the use of fertilizers and pesticides visiting small farms around Ahmedabad in Matar and Shilaj.
Between Filth and Fortune- Urban Cattle Foraging Realities by Devi S Nair, An...Mansi Shah
This study examines cattle rearing in urban and rural settings, focusing on milk production and consumption. By exploring a case in Ahmedabad, it highlights the challenges and processes in dairy farming across different environments, emphasising the need for sustainable practices and the essential role of milk in daily consumption.
Dive into the innovative world of smart garages with our insightful presentation, "Exploring the Future of Smart Garages." This comprehensive guide covers the latest advancements in garage technology, including automated systems, smart security features, energy efficiency solutions, and seamless integration with smart home ecosystems. Learn how these technologies are transforming traditional garages into high-tech, efficient spaces that enhance convenience, safety, and sustainability.
Ideal for homeowners, tech enthusiasts, and industry professionals, this presentation provides valuable insights into the trends, benefits, and future developments in smart garage technology. Stay ahead of the curve with our expert analysis and practical tips on implementing smart garage solutions.
Hello everyone! I am thrilled to present my latest portfolio on LinkedIn, marking the culmination of my architectural journey thus far. Over the span of five years, I've been fortunate to acquire a wealth of knowledge under the guidance of esteemed professors and industry mentors. From rigorous academic pursuits to practical engagements, each experience has contributed to my growth and refinement as an architecture student. This portfolio not only showcases my projects but also underscores my attention to detail and to innovative architecture as a profession.
Case Study - Design an Art History App for an Art Gallery.pptx
1. Design an art history app
for an art gallery
Chan Jia Jun
2. The product:
Art History App strives to curate and exhibit works by
both established and emerging artists, with a focus on
promoting diversity and inclusivity in the art world. This
app’s goal is to create a user-friendly app that not only
provides access to the gallery's collection but also offers
interactive educational resources for art enthusiasts
and students.
Project overview
Project duration:
December 2022 to March 2023
3. The problem:
Researchers, students, and designers lack
inspiration and confidence in their design
works because they struggle to find new
design ideas to explore.
Project overview
The goal:
Design an art history app that provides an
easily accessible source of design ideas and
inspirations, ultimately boosting user
recognition and confidence in their design
works.
4. My role:
UX designer designing an art history app for an
art gallery from the initial concept phase to the
final delivery of the product.
Project overview
Responsibilities:
Conducting paper and digital wireframing, low
and high-fidelity prototyping, conducting
unmoderated usability studies, accounting for
accessibility, and iterating on designs.
6. User research: summary
Based on my user research, an art history app is being developed to address the problem of
researchers and students struggling to find new design ideas. The goal is to boost user confidence
by providing an easily accessible source of inspiration.
The app will compete in the market by offering core features like in-app navigation, search, and
posting artwork. The research will be conducted to determine the app's usability and user
engagement. The app will attract and retain users in the online system, ultimately increasing
customer satisfaction and retention.
7. User research: pain points
Directionless
Students lack guidance
or direction on how to
use inspiration to create
original designs and
increase confidence in
their design skills.
Time
Time-consuming and
tedious process of
browsing through
numerous sources for
inspiration
Feedback
Designers have difficulty
in finding a reliable and
diverse platform to
compare and contrast
designs to gain
inspiration and
knowledge on design
trends.
Navigation
Limited access to
professional feedback
and industry insights,
leading to a narrow
perspective on design
practices and strategies.
1 2 3 4
8. Persona: Lene
Problem statement:
Lena, a Graphic Design
freelancer, is struggling to
attract and retain clients due
to the lack of effective
marketing design work.
Without a steady stream of
clients and feedback for
improvement, Lena's career
as a freelancer is at risk.
9. User journey map
Image of user
journey map
Mapping Lena’s user
journey revealed how
helpful it would be for
users to have access to a
dedicated Art History app.
10. Persona: Jessica
Problem statement:
Jessica, a soon-to-be
graduate in Graphic Design,
seeks a reliable source of
inspiration from professional
design work to improve their
confidence and overcome
roadblocks.
11. User journey map
Mapping Lena’s user
journey has inspired the
idea that a dedicated Art
History app would be
beneficial for users like
myself who are looking for
inspiration and reference in
graphic design.
12. ● Paper wireframes
● Digital wireframes
● Low-fidelity prototype
● Usability studies
Starting
the design
13. Paper wireframes
The purpose of this paper is to outline the
wireframe design for an art history app.
This app will be designed to provide an
enjoyable and educational experience for
art enthusiasts, students, and researchers.
The wireframes for the app were
developed after careful consideration of
user pain points, and an emphasis was
placed on ease of use and accessibility. The
home screen wireframe was given
particular attention to ensure that the user
experience was streamlined.
Stars were used to mark the elements of each sketch that would be used in the initial digital
wireframes.
14. Digital wireframes
Throughout the initial
design phase, I ensured
that the screen designs
were grounded in the
feedback and findings
obtained from the user
research.
This section
showcases a
selection of art
examples from the
author, designed to
entice users to
explore further. This button
provides an
easy option for
viewing all art.
15. Digital wireframes
In addition to making the
app compatible with
assistive technologies,
addressing the key user
need for easy navigation
was also a top priority in
the design process.
The design aims
to provide screen
reader-friendly
navigation that is
easily accessible.
The tab bar
has been
designed to
ensure easy
access to
frequently
used
navigation.
16. Low-fidelity prototype
After finalizing the digital
wireframes, I developed a low-
fidelity prototype that focused on
the primary user flow of viewing
art history and galleries. This
allowed the prototype to be used
in a usability study.
View the Art History App
Low-fidelity prototype
17. Usability study: findings
I conducted two rounds of usability studies to evaluate the effectiveness of the design. The findings from the
first study were used to inform the design changes from wireframes to mockups. In the second study, a high-
fidelity prototype was used to identify areas for improvement and refinement in the mockups.
Round 1 findings
Users have expressed that they find the
design to be elegant and of high-end
quality.
1
Users have conveyed that there are too
many features that are still in development
and the frequent "coming soon" popups are
causing concern.
2
Round 2 findings
Users want to find and view artwork easier
1
Users have expressed a desire for additional
information on artwork.
2
Users want more features for both profile
and artwork
3
4 Users with vision impairments face
accessibility challenges.
19. Mockups
The findings from the usability
study showed that users wanted
more information on the artwork.
To address these concerns, I
incorporated a new modal screen
that provides more details about
the artwork and author.
Additionally, users with vision
impairments face accessibility
challenges. I included high-contrast
colors for primary, secondary, and
accent colors to enhance
accessibility for users with vision
impairments.
Before usability study After usability study
20. Mockups
To improve navigation, I replaced
the top navigation bar with a
search icon and added profile
features to both the side menu and
bottom tab bar.
Additionally, to provide users with
more features for profiles and
artwork, I added new features such
as a favorites section, chat system,
camera with scan and detect
features, and music, along with
sharing and artwork posting
features, currently with the
“Coming Soon” modal.
Before usability study After usability study
Navigation Bar
Tab Bar
22. High-fidelity prototype
The final high-fidelity prototype
presented cleaner user flows for
viewing art galleries, author details,
and core features such as in-app
navigation, search, and coming soon
features like posting artwork,
profiles, and so on.
View the Art History App
High-fidelity prototype
23. Accessibility considerations
Used detailed imagery
and descriptive captions
for artworks to help all
users, including those
with visual impairments,
better understand the
designs.
Used navigation menu,
tab bar, and search bar to
help make
navigation easier.
Provided alt text for
images, enabling users
with screen readers to
access the visual content
of the app.
1 2 3
25. Takeaways
Impact:
The art gallery app successfully meets users' needs,
providing a seamless experience in discovering and
exploring artwork while offering a range of features
to enhance the overall experience.
What I learned:
To improve the design process for the Art History App, I learned
how to develop a design guideline and sticker sheet before
starting the design phase, resulting in a more efficient design
process.
Through this process, I gained valuable experience in creating
animations, and interactive components, utilizing auto layout
effectively, and more, leading to a more polished and user-
friendly final product.
26. Next steps
Conduct another user
testing to gather feedback
from real users. User
testing can help to
identify areas of
improvement and make
necessary adjustments
before launching the app.
Review and refine the
typography, color palette,
visual hierarchy, and
updating components to
ensure consistency
throughout the.
Also, complete all
remaining features and
thoroughly test the app
before launching it.
Create a professional
portfolio or presentation
or write-up to showcase
the final design.
1 2 3
27. Let’s connect!
Thank you for your time reviewing my work on the Art History App! If you’d like to
see more or get in touch, my contact information is provided below.
Email: skychan.93sky@gmail.com
Linkedln: https://www.linkedin.com/in/chan-jia-jun-baa70213b/