IG STORIES GRID MODE X GIFS BOOST
How might we improve how we use and access gifs for IG stories
with a just a few subtle design & usage boosts?
BACKGROUND
Instagram stories is a platform for many things- from promoting self/brand/product to bringing awareness to important issues while also providing a more intimate view into someone’s life than static posts. One of the great things about IG stories is that there are many ways to take advantage of the tool as a way to produce creative content - it’s a compelling platform for both personal and on-brand storytelling.
![]()
![]()
![]()
Once IG stories introduced gifs, it made for a fun and engaging
experience to create content with that special touch only gifs can provide.
Peep below the true story of the time I discovered how my kid felt about hamburgers while we were driving down the 5 toward LA.
Use < and > to scroll through the story.
Once IG stories introduced gifs, it made for a fun and engaging
experience to create content with that special touch only gifs can provide.
Peep below the true story of the time I discovered how my kid felt about hamburgers while we were driving down the 5 toward LA.
Use < and > to scroll through the story.
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
PROBLEM & OPPORTUNITY
PROBLEM & OPPORTUNITY
Gifs are fun and can have high impact for a story.
However, sometimes they can be a challenge to search
for and without the option to save, sometimes you simply can’t
remember how to find that one wacky gif all over again.
Let’s fix this!
However, sometimes they can be a challenge to search
for and without the option to save, sometimes you simply can’t
remember how to find that one wacky gif all over again.
Let’s fix this!
RESEARCH
Key Interview Findings I conducted 1-1 interviews w/users with a range of familarity of IG stories, including individuals & business owners.PAIN POINTS
Gifs can’t be saved for quick access Searching for gifs can be arbitrary and time consuming
Assembling a story in-app can be clunky.
Gifs can’t be saved for quick access Searching for gifs can be arbitrary and time consuming
Assembling a story in-app can be clunky.
POSITIVE EXPERIENCES
Stories can go from concept to creation to shared very quickly
The experience of making a story is fun
The engagement tools offer a range of creativity
The experience of making a story is fun
The engagement tools offer a range of creativity
NEW FEATURES
NEW FEATURES
The challenge was to embed and introduce new features within
the app to increase ease of gifs usage seamlessly -
no major overhaul needed.
![]()
Save-a-fave gif
![]()
Gifs categories page
![]()
Recently used gifs
![]()
Grid mode for better layout
![]()
Use the < arrows > to see the new features below:
![New feature! Long press to save a fave gif]()
![Recently Used & Trending gifs]()
![Gifs Categories enable quick access]()
![GRID ON, GRID OFF!]()
![]()
Test drive the lofi prototype here
![]()
the app to increase ease of gifs usage seamlessly -
no major overhaul needed.
Save-a-fave gif
Gifs categories page
Recently used gifs
Grid mode for better layout
Use the < arrows > to see the new features below:
Test drive the lofi prototype here
INTERACTION DESIGN
User flows help inform future design decisions
The goal of the user flow was to ensure any additional screens, features, or functions were synthesized with the already established design for flawless integration.
![]()
![]()
![Long press to save a trending gif to favorites for easy & quick access!]()
![Categories make it easy & quick to find gifs!]()
![Interaction screens at-a-glance]()
![Toggling on and off the grid]()
By testing out the hifi prototype, users were able to get a sense of how the new features worked and where they could still use additional adjustments and iterations. With a rapid design cycle(s) I kept the prototype pared down and focused on feedback from testers.
![]()
HIGH-FIDELITY PROTOTYPING
Let’s try it out
By testing out the hifi prototype, users were able to get a sense of how the new features worked and where they could still use additional adjustments and iterations. With a rapid design cycle(s) I kept the prototype pared down and focused on feedback from testers.
Test drive the high fidelity prototype here
![]()
As an avid user of IG stories and gifs, this project was a effort of pairing a vision with restraints under constraints and staying focused by what on user needs as revealed through interviews and surveys.
While there was no shortage of wild ideas and possibilities of potential features and functions, this project can easily birth a number of design sprints, tweaks, and modifications in future iterations.
![]()
WHAT’S NEXT?
Insights and takeaways
As an avid user of IG stories and gifs, this project was a effort of pairing a vision with restraints under constraints and staying focused by what on user needs as revealed through interviews and surveys.
While there was no shortage of wild ideas and possibilities of potential features and functions, this project can easily birth a number of design sprints, tweaks, and modifications in future iterations.
