Joe Sioufi is a UX/UI designer based in Brooklyn, New York. His portfolio includes case studies from redesign projects for 1-800-Flowers.com and Fandango. For 1-800-Flowers.com, he led a team that redesigned the global navigation to increase visibility of brand tabs and simplify the design. For Fandango, his team added features like nearby event notifications and digital ticket storage to help expand Fandango's market beyond movie tickets. Both projects involved user research, design iterations, and user testing to inform the final recommendations.
Hi I'm Gradinar Razvan and these are some sample projects that I've done in the past. It includes some samples from my experience as a UX UI designer, Visual Designer, Web Designer, Graphic Designer and 3D Visualization Artist
My portfolio can be seen here:
http://builtbyg.com
High-ress:
http://builtbyg.com/portfolio.pdf
Facebook:
http://facebook.com/builtbyg
Youtube
http://youtube.com/GradinarRazvan
Presented by Nehal Medh, Managing Director, Consumer Experiences, GfK
at Qualitative360 Asia 2013
19-21 November 2013, Singapore
This event is proudly organised by Merlien Institute
Check out our upcoming events by visiting http://qual360.com/
Hi I'm Gradinar Razvan and these are some sample projects that I've done in the past. It includes some samples from my experience as a UX UI designer, Visual Designer, Web Designer, Graphic Designer and 3D Visualization Artist
My portfolio can be seen here:
http://builtbyg.com
High-ress:
http://builtbyg.com/portfolio.pdf
Facebook:
http://facebook.com/builtbyg
Youtube
http://youtube.com/GradinarRazvan
Presented by Nehal Medh, Managing Director, Consumer Experiences, GfK
at Qualitative360 Asia 2013
19-21 November 2013, Singapore
This event is proudly organised by Merlien Institute
Check out our upcoming events by visiting http://qual360.com/
Experience Designer Fiona Slocombe joins UX Gatherings to speak about her work with Pause Fest 2017, and the process she used to co-design the festival experience.
Fiona will speak about the work she did with the audience, speakers, staff and exhibitors to discover what people value about Pause festival. She will then deep dive into how they designed Pause 2017, and what they needed to improve, remove and create to produce a valuable festival experience.
Fiona entered experience design building real world experiences as a Space Planner in 2004. Her career has included Strategic Planning, Project Management, Space Analytics and being accredited as a LEGO® Serious Play Facilitator.
Fiona draws upon her diverse perspectives as an experience designer and passion for human centred design to ensure products and spaces are made for the right reasons and the right audiences.
Analytics for Musicians - Presentation to Chamber Music America - December 2n...Marshall Sponder
This presentation covers the kind of data that can be collected and how it might be used to promote the local and online following of Classical and Jazz Musicians.
In particular, we take a tour of some of the more exotic enhancements in Google Analytics combined with Geo-Location that I have become found of lately.
The work in this course also draws on the work I do at Baruch College Zicklin School of Business, where I am a Lecturer Faculty - much of the work I present has been informed by students who helped to pull the data around certain of the slides.
Finally, the need to develop the assessments also draws upon the Rutgers University Social Media for the Arts.
This deck does a nice job of blending the thinking behind the teachings I've done in both places, and is a true synthesis.
What does it take?
by Christine Klaehn
What is the value of social media to your organization and to your brand? There are many types of brands--personal brands, commercial brands, experiential brands. Every brand makes a promise and sometimes a brand is severely damaged when the promise is an over promise (insert Tiger Woods). And sometimes, with much advice and diligence and patience, a brand, over time, rebounds and regains trust and admiration from its audiences (insert Martha Stewart). These brands, however, are made of one voice. An educational institution is made up of a chorus of voices.
We challenge the timidity that exists around social media and explore the nature of an educational brand -- its strengths, challenges, and opportunities. The goal will be to create new ideas and approaches to create something much richer than communication: engagement.
As a team of 3 designers, we were tasked by BRIC’s marketing team to create a website redesign that would engage their diverse user base and showcase their vast content.
Creating A Healthy Influencer Marketing ProgramEmre Ersahin
For years and years companies have tried hard to create & manage brand ambassador communities. Some did it, most could not. Here is a presentation on the common denominators of those successful programs that did it.
Delivered to the 2011 DMA audience, by MRM and the Social Media Society, this presentation looks at the new truths that affect how we operate as practitioners in the agency environment and how these new truths can help a social media practitioner become a Star!
Put Your Creative to Work: Creative Testing for Nonprofits: 2018 Washington N...PMX Agency
Creative is the heart and soul of your nonprofit brand and fundraising initiatives, and can act as the powerful catalyst that evokes an emotion, and influences a donor to give to your cause. But, Creative doesn’t come in a one-size-fits-all approach, nor does it always have a defined formula or set of best practices. From different audience needs, to different team goals, Creative that performs requires a synergy between the art and the science. In this session, we’ll be digging into how to bridge the gap between your Creative aspirational goals, and the data that powers your Creative strategy. We’ll look at smart methods for creative testing, what types of Creative work across different media platforms, and how to form a collaborative working strategy across teams that aligns fundraising, marketing and Creative objectives. We’ll look at case studies from the American Heart Association, as well as a range of other organizations to illustrate how Creative was taken from concept to execution
Experience Designer Fiona Slocombe joins UX Gatherings to speak about her work with Pause Fest 2017, and the process she used to co-design the festival experience.
Fiona will speak about the work she did with the audience, speakers, staff and exhibitors to discover what people value about Pause festival. She will then deep dive into how they designed Pause 2017, and what they needed to improve, remove and create to produce a valuable festival experience.
Fiona entered experience design building real world experiences as a Space Planner in 2004. Her career has included Strategic Planning, Project Management, Space Analytics and being accredited as a LEGO® Serious Play Facilitator.
Fiona draws upon her diverse perspectives as an experience designer and passion for human centred design to ensure products and spaces are made for the right reasons and the right audiences.
Analytics for Musicians - Presentation to Chamber Music America - December 2n...Marshall Sponder
This presentation covers the kind of data that can be collected and how it might be used to promote the local and online following of Classical and Jazz Musicians.
In particular, we take a tour of some of the more exotic enhancements in Google Analytics combined with Geo-Location that I have become found of lately.
The work in this course also draws on the work I do at Baruch College Zicklin School of Business, where I am a Lecturer Faculty - much of the work I present has been informed by students who helped to pull the data around certain of the slides.
Finally, the need to develop the assessments also draws upon the Rutgers University Social Media for the Arts.
This deck does a nice job of blending the thinking behind the teachings I've done in both places, and is a true synthesis.
What does it take?
by Christine Klaehn
What is the value of social media to your organization and to your brand? There are many types of brands--personal brands, commercial brands, experiential brands. Every brand makes a promise and sometimes a brand is severely damaged when the promise is an over promise (insert Tiger Woods). And sometimes, with much advice and diligence and patience, a brand, over time, rebounds and regains trust and admiration from its audiences (insert Martha Stewart). These brands, however, are made of one voice. An educational institution is made up of a chorus of voices.
We challenge the timidity that exists around social media and explore the nature of an educational brand -- its strengths, challenges, and opportunities. The goal will be to create new ideas and approaches to create something much richer than communication: engagement.
As a team of 3 designers, we were tasked by BRIC’s marketing team to create a website redesign that would engage their diverse user base and showcase their vast content.
Creating A Healthy Influencer Marketing ProgramEmre Ersahin
For years and years companies have tried hard to create & manage brand ambassador communities. Some did it, most could not. Here is a presentation on the common denominators of those successful programs that did it.
Delivered to the 2011 DMA audience, by MRM and the Social Media Society, this presentation looks at the new truths that affect how we operate as practitioners in the agency environment and how these new truths can help a social media practitioner become a Star!
Put Your Creative to Work: Creative Testing for Nonprofits: 2018 Washington N...PMX Agency
Creative is the heart and soul of your nonprofit brand and fundraising initiatives, and can act as the powerful catalyst that evokes an emotion, and influences a donor to give to your cause. But, Creative doesn’t come in a one-size-fits-all approach, nor does it always have a defined formula or set of best practices. From different audience needs, to different team goals, Creative that performs requires a synergy between the art and the science. In this session, we’ll be digging into how to bridge the gap between your Creative aspirational goals, and the data that powers your Creative strategy. We’ll look at smart methods for creative testing, what types of Creative work across different media platforms, and how to form a collaborative working strategy across teams that aligns fundraising, marketing and Creative objectives. We’ll look at case studies from the American Heart Association, as well as a range of other organizations to illustrate how Creative was taken from concept to execution
Expert Accessory Dwelling Unit (ADU) Drafting ServicesResDraft
Whether you’re looking to create a guest house, a rental unit, or a private retreat, our experienced team will design a space that complements your existing home and maximizes your investment. We provide personalized, comprehensive expert accessory dwelling unit (ADU)drafting solutions tailored to your needs, ensuring a seamless process from concept to completion.
Transforming Brand Perception and Boosting Profitabilityaaryangarg12
In today's digital era, the dynamics of brand perception, consumer behavior, and profitability have been profoundly reshaped by the synergy of branding, social media, and website design. This research paper investigates the transformative power of these elements in influencing how individuals perceive brands and products and how this transformation can be harnessed to drive sales and profitability for businesses.
Through an exploration of brand psychology and consumer behavior, this study sheds light on the intricate ways in which effective branding strategies, strategic social media engagement, and user-centric website design contribute to altering consumers' perceptions. We delve into the principles that underlie successful brand transformations, examining how visual identity, messaging, and storytelling can captivate and resonate with target audiences.
Methodologically, this research employs a comprehensive approach, combining qualitative and quantitative analyses. Real-world case studies illustrate the impact of branding, social media campaigns, and website redesigns on consumer perception, sales figures, and profitability. We assess the various metrics, including brand awareness, customer engagement, conversion rates, and revenue growth, to measure the effectiveness of these strategies.
The results underscore the pivotal role of cohesive branding, social media influence, and website usability in shaping positive brand perceptions, influencing consumer decisions, and ultimately bolstering sales and profitability. This paper provides actionable insights and strategic recommendations for businesses seeking to leverage branding, social media, and website design as potent tools to enhance their market position and financial success.
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?
You could be a professional graphic designer and still make mistakes. There is always the possibility of human error. On the other hand if you’re not a designer, the chances of making some common graphic design mistakes are even higher. Because you don’t know what you don’t know. That’s where this blog comes in. To make your job easier and help you create better designs, we have put together a list of common graphic design mistakes that you need to avoid.
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.
Between Filth and Fortune- Urban Cattle Foraging Realities by Devi S Nair, An...
Design Portfolio
1. UX/UI & PRODUCT DESIGNER
JOE SIOUFI
JOE SIOUFI | PORTFOLIO
Brooklyn, New York
1
Contents
2
3
16
32
About Me
1-800-Flowers.com
Fandango
RecoveryHub
inDiscover 42
2. JOE SIOUFI | PORTFOLIO
Through empathy and design, I use my
powers to solve usability problems in the
digital space.
Through my experience as both a designer
and researcher, I have developed the skills to
design, test and iterate desirable on digital
products. My background in behavioral
psychology not only allows me to grasp the
cognitive processes involved when using web
and mobile applications, but to also design
solutions through the lens of the user.
I turned to design because I wanted a more
creative, people-centric career, where the
challenges presented to me result an
improved experience for others. My favorite
tools are a dry-erase board and marker.
ABOUT ME
2
3. Goals:
•Increase the visibility of brand tabs
•Increase the visibility of brand
category descriptors
•Reorganize global navigation
elements for a simple and clean
design
•Create more multi-brand customers
and account conversions
CASE STUDY: 1-800-FLOWERS.COM
BRIEF
My team was asked to redesign the global navigation for the multi-brand
portal 1-800-Flowers.com, which features six different brands, in order to
increase the visibility of the brand tabs and simplify the overall design.
CASE STUDY
JOE SIOUFI | 1-800-FLOWERS.COM 3
5. RESEARCH & DISCOVERY
COMPARATIVE ANALYSIS
The research process began by
analyzing the global navigation designs
of other multi-brand portals
CASE STUDY
JOE SIOUFI | 1-800-FLOWERS.COM 5
6. My team and I also examined designs
of competing floral delivery sites for
secondary research
RESEARCH & DISCOVERY
CASE STUDY
JOE SIOUFI | 1-800-FLOWERS.COM
COMPETITIVE ANALYSIS
6
7. Name: Lizzy
Age: 49
Location: Wayne, PA
Occupation: High
School Guidance
Counselor
USER PERSONAS
Primary User Scenario
Lizzy’s niece is performing in a ballet in New
York City and the opening night is coming up.
Lizzy regrets that she cannot make it and wants
to send flowers and chocolate in lieu of her
attendance.
She has had an account with 1-800-
Flowers.com for a few years since she started
using it more often for birthdays, holidays and
other occasions.
Name: Michelle
Age: 33
Location: Clinton Hill, Brooklyn
Occupation: Media Manager,
Account Planning
Secondary User Scenario
The holiday season is approaching. Michelle wants to
send a basket of popcorn and other snacks to her client
who gives her the most business.
She has never shopped with 1-800-Flowers.com or any
of its brands but has heard of its services and wants to
give it a try.
CASE STUDY
JOE SIOUFI | 1-800-FLOWERS.COM 7
9. DESIGN PROCESS
For our initial sketches we did a design
studio: Each of us sketched multiple
versions of the same screen, discussed
them, sketched them again and then worked
together to make a sketch combining the
best features of each design.
DESIGN STUDIO
CASE STUDY
JOE SIOUFI | 1-800-FLOWERS.COM 9
10. As the lead visual designer for my team, I came up with design iterations and created high-fidelity mockups
for our user tests. The iterations focused on nuances in color, copy and element placement.
DESIGN PROCESS
PHOTOSHOP MOCKUPS
CASE STUDY
JOE SIOUFI | 1-800-FLOWERS.COM 10
12. My team and I conducted a series of user tests, both A/B and multivariate, to test our design iterations.
USER TESTING
A/B AND MULTIVARIATE TESTS
CASE STUDY
JOE SIOUFI | 1-800-FLOWERS.COM
Descriptors above v. below v. icons
My Account v. Sign in v. Sign in/Register
Contact us v. Help v. Customer Service
12
13. The final redesign elements were based on both the average
time it took people to locate them and their feedback
“I THINK IT WAS VERY EASY, AND YOU
CAN SEE EVERYTHING YOU WANT.”
USER TESTING
USER FEEDBACK
“I FOUND IT VERY HELPFUL TO HAVE ONE TO TWO DESCRIPTIVE WORDS AT THE BOTTOM OF
EACH BRAND, ALLOWING ME TO UNDERSTAND WHAT THE PRIMARY PRODUCT WOULD BE.”
“THE FONT AND COLOR POPPED OUT
AND WERE EASILY NOTICEABLE.”
CASE STUDY
JOE SIOUFI | 1-800-FLOWERS.COM 13
14. Brief
FINAL DESIGN
RECOMMENDATIONS
• Move category descriptions in the global navigation below the brand logos and change
their color from red to navy blue for greater readability
• Keep the inactive tabs grayed-out but bring color back to the logo and category
descriptors to increase visibility
• Change the wording of the “Customer Service” link to “Contact Us”
• Change the wording of the “International delivery” button to read “Ship to”
• Change the color of the “Store Locator” and “Contact Us” links so they pop out more
CASE STUDY
JOE SIOUFI | 1-800-FLOWERS.COM 14
15. Brief
FINAL DESIGN
PITCH & RESULT
We pitched our design to our client and the CEO. It was then brought to a meeting where it
was put up against two other designs. Ours was chosen to be implemented.
CASE STUDY
JOE SIOUFI | 1-800-FLOWERS.COM 15
16. My team was asked to add new features to
the existing Fandango app to help expand
its market from movie tickets to include
tickets for concerts and local events.
The features we added were:
• Nearby event notifications
• Easy in-app ticket purchasing
• Digital pass storage and display
CASE STUDY: FANDANGO
BRIEF
CASE STUDY
JOE SIOUFI | FANDANGO 16
18. RESEARCH & DISCOVERY
USER SURVEY
We administered a survey about ticket purchasing habits
to concerts and events to over 130 people.
Through our results we found that
78% of people reported
that they find out about
concerts and events through
word of mouth, while 77%
reported that they find out
through social media
74% of people reported
that they use Ticketmaster to
purchase tickets, from which we
concluded that this is its biggest
competitor
38% of people preferred a
scannable e-ticket as their
delivery method, making it the
most popular choice
CASE STUDY
JOE SIOUFI | FANDANGO 18
19. RESEARCH & DISCOVERY
COMPETIVE & COMPARATIVE ANALYSIS
We analyzed existing competing apps in the concert and event
ticketing market, as well as apps that offer similar services.
Common features we identified were:
• The ability to favorite and follow artists &
events
• To search and sort through events using filters
• To enable location services and integrate
Facebook “likes” in order to generate a custom
list of recommended events
• A scannable e-ticket
CASE STUDY
JOE SIOUFI | FANDANGO 19
20. USER INTERVIEWS
We conducted a series of user interviews
and discovered the following trends
• Facebook is the most popular way to
share events
• Concerts are the most attended events
• People enjoy going to events with
friends and purchasing their tickets
together
CASE STUDY
JOE SIOUFI | FANDANGO 20
21. Despite the many ways Facebook is used to post third-party
events, the “share” button was the least utilized.
“WHO USES THE ‘SHARE’ BUTTON? THAT’S SO BASIC.”
People preferred to:
• Manually post the link and tag their friends in it
• Directly message their friends with the link
• Find the Facebook event page and send invites to their
friends
RESEARCH & DISCOVERY
FACEBOOK
CASE STUDY
JOE SIOUFI | FANDANGO 21
22. With the qualitative and
quantitative user research we
gathered, we compiled an affinity
diagram to inform our user
personas.
RESEARCH & DISCOVERY
AFFINITY DIAGRAM
CASE STUDY
JOE SIOUFI | FANDANGO 22
23. USER PERSONAS
Age:
24
Location:
Bushwick
Occupation: Communications
Assistant at a nonprofit
organization based in NYC
Education: BA in Communications
from Boston University
Tech empathy:
Medium
Likes/hobbies/activities: “Exploring” the
city with her friends; concerts; food
events/ festivals; advocating for gender
equality; contemporary art museums;
yoga; photography
Music:
Real Estate; Arcade Fire; SBTRKT;
Disclosure; Panda Bear; Rihanna; Kanye
West
Social Media:
Facebook; Instagram;
Tumblr; Snapchat; Tinder
PRIMARY USER: JESS RIVERS
Goals
• Know what’s happening near
her
• Coordinate events with others
• Find cheap tickets
• Convenient ticketing
Features Needed
• Easy way to browse by event
type
• Easy way to scale events by
price
• Scannable E-ticket
• Easy Social Media Sharing
Pain Points
• She has no printer
• The bigger concerts she likes often
sell out
• Does not have a lot of disposable $
CASE STUDY
JOE SIOUFI | FANDANGO 23
24. USER PERSONAS
Age: 60
Location: Scarsdale, NY
Occupation: Account Manager
selling ad space for a local
newspaper
Education: BS in Management &
Business from Ithaca College
Tech empathy: High
Likes/hobbies/activities: Going to the
movies with his girlfriend; going out to
eat and drink with friends; bowling
Music: Bob Dylan; Grateful Dead; Allman
Brothers
Social Media: Facebook
SECONDARY USER: JACK BILLSON
Goals
• Provide a simple and easy way
to purchase process
• System to track events
• Store e-tickets
Features Needed
• Minimal steps in selection and
checkout process
• Social media sharing of
purchases
• Alerts from favorited
performers
Pain Points
• Waiting in line
• Difficult navigation when looking for
most needed features
• Server overload when popular tickets
go on sale
CASE STUDY
JOE SIOUFI | FANDANGO 24
25. DESIGN PROCESS
For our initial sketches we did a design
studio: Each of us sketched multiple
versions of the same screen, discussed
them, sketched them again and then worked
together to make a sketch combining the
best features of each design.
DESIGN STUDIO
CASE STUDY
JOE SIOUFI | FANDANGO 25
26. Brief
Home Screen
A trend we discovered in our first
round of user testing was that
everybody went straight to the
“view all categories” button.
We iterated our design by adding a categories button to
the navigation bar. That way the user could access the
master category list from every screen and we could use
that space on the home screen for more specific content.
DESIGN PROCESS
WIREFRAMES & ITERATIONS
CASE STUDY
JOE SIOUFI | FANDANGO 26
27. Concert Listing Screen
For users who know already know what they are looking for, we added a
“buy now” button to streamline the purchasing process.
DESIGN PROCESS
WIREFRAMES & ITERATIONS
CASE STUDY
JOE SIOUFI | FANDANGO 27
29. E-Ticket Storage
“I LIKE TO GET MY
TICKETS RIGHT ON MY
IPHONE AND SCAN IT AT
THE DOOR.”
The existing Fandango app featured in-app
ticket storage, however users found it hard to
find. We surfaced this feature by adding it to the
navigation bar so that e-tickets could be
accessed from any screen
PROTOTYPE
USER TESTING
CASE STUDY
JOE SIOUFI | FANDANGO 29
30. Since we found that people prefer to
manually copy and paste links to share
them with their friends, we made sure to
add an option to conveniently do so
“I COPIED AND PASTED
THE LINK TO MY FRIEND’S
WALL AND THEN TAGGED
OTHER FRIENDS THAT I
WANTED TO COME.”
PROTOTYPE
USER TESTING
Share Options
CASE STUDY
JOE SIOUFI | FANDANGO 30
31. Fandango’s current Fanalert system allows
users to track unreleased movies and then
notifies them when the tickets go on sale
We expanded on this system by allowing users
to also set Fanalerts for their favorite artists
and events to not only notify them when they
are happening but to also include exclusive
pre-sales and notifications for when an event
is running low on tickets
PROTOTYPE
ADDITIONAL FEATURES
Fanalerts
CASE STUDY
JOE SIOUFI | FANDANGO 31
32. Goals:
•Provide a quick and simple way for
survivors to find the help they need
•Connect workers and volunteers to
relief opportunities
•Facilitate communication between
relief organizations, workers and
survivors
CASE STUDY: RECOVERYHUB
BRIEF
To provide an online platform that enables community-led disaster relief by
connecting survivors, relief organizations and relief workers.
CASE STUDY
JOE SIOUFI | RECOVERYHUB 32
33. RESEARCH & DISCOVERY
CASE STUDY
JOE SIOUFI | RECOVERYHUB
PRIMARY ANALYSIS
Our design research began
by analyzing the websites
of other relief organizations
33
34. RESEARCH & DISCOVERY
SECONDARY ANALYSIS
CASE STUDY
JOE SIOUFI | RECOVERYHUB
Social media sites that function in a
similar fashion were also examined
34
35. USE CASES
CASE STUDY
JOE SIOUFI | RECOVERYHUB
As a team, we brainstormed the
different types and what their
goals would be when using the site
User categories
•Survivors
•Community/spiritual leaders
•Relief staff/volunteers
•Relief organizations
•Small businesses
35
36. DESIGN PROCESS
CASE STUDY
JOE SIOUFI | RECOVERYHUB
I was given lo-fidelity wireframes made in Google Draw, which I
made iterations of in Photoshop, eventually bringing them to high-
fidelity mockups
36
38. CASE STUDY
JOE SIOUFI | RECOVERYHUB
I loaded our screens into InVision to make a
clickable prototype and conduct user testing
First users were tested on a
general understanding of the
site
Users were then prompted
with scenarios so we could
observe where they would
click to find what they were
looking for
USER TESTING
PROTOTYPE
38
39. CASE STUDY
JOE SIOUFI | RECOVERYHUB
USER TESTING
USER INSIGHTS
“It should be easier to find
volunteer opportunities and
vice versa”
“I like how it shows
dates and affected
states for disasters”
“I woudn’t look for help
filing a FEMA claim under
‘find help’”
“‘Events’ probably
includes events like
community meetings that
directly affect the
recovery process”
“Seems like a way for people
to reach out to those in their
community who need help”
39
40. CASE STUDY
JOE SIOUFI | RECOVERYHUB
USER TESTING
DESIGN ITERATIONS
The biggest usability issue we found with our design was
that it was not obvious where to go to find help or volunteer
To address the issue, we surfaced the help
options by giving them their own sidebar
on the user’s dashboard, using icons and
the accent color for increased visibility
40
41. CASE STUDY
JOE SIOUFI | RECOVERYHUB
USER TESTING
DESIGN ITERATIONS
I designed a sticky navigation bar that
appears when the user scrolls below the fold
We also added a collapsible sidebar
menu for the user’s groups, events and
content so this information could
become more accessible
41
42. CASE STUDY: INDISCOVER
BRIEF
inDiscover [indie • scover] is a mobile app
designed to help people discover independent
artists based on the genres they are interested in.
The user enters “tags” that serve as filters and the
music player streams songs by artists who are
associated with those tags.
CASE STUDY
JOE SIOUFI | INDISCOVER 42
Features:
• Ability to filter by “tags” (i.e. genres)
• Stores list of “liked” songs
• Directs you to more information on the artists
• Ability to save and toggle between tag lists
43. HOW IT WORKS
ANNOTATIONS
CASE STUDY
JOE SIOUFI | INDISCOVER 43
Screen slides left to
list of “liked songs”
Screen slides right to
preferences menu
Likes artist, double-tap
to play next song
Likes artist and
plays next song
Dislikes artist and
plays next song
Also dislikes artist
and plays next song
Music player
control panel
HOME SCREEN
44. HOW IT WORKS
ANNOTATIONS
CASE STUDY
JOE SIOUFI | INDISCOVER 44
Back to previous screen
Hold tags down to
show “X”, press
“X” to delete
Create new tag list
Text field to enter
genre tags that filter
music stream
Goes back to
home screen
PREFERENCES
Drop down menu
to toggle between
saved tag lists
Saves tag list
45. HOW IT WORKS
ANNOTATIONS
CASE STUDY
JOE SIOUFI | INDISCOVER 45
Back home screen
Text field to search
through liked artists
“LIKED” ARTISTS
Deletes song from list
Goes to external site
where the song was
taken from
46. DESIGN RESEARCH
COMPETIVE & COMPARATIVE ANALYSIS
CASE STUDY
JOE SIOUFI | INDISCOVER 46
• Content
• Interface
• App flow
• Interface
• Content
• Interface
The designs of the Pandora, Bandcamp and Tinder apps
were researched for content, interface and app flows.
49. CASE STUDY
JOE SIOUFI | INDISCOVER 49
INDISCOVER
NEXT STEPS
Additional Features:
• Search by genre (in addition to filtering)
• Create user and artist profiles
• Share tag lists in app and/or via social media
50. JOE SIOUFI | BEAT.BOX 50
BEAT.BOX
BRIEF
To design a landing page
and mobile interface for
a music discovery app.
51. JOE SIOUFI | BEAT.BOX
MOBILE PLAYER INTERFACE
51