Instagram Website Redesign
Meta · Web Design · Interaction Design
turning a static screenshot into an experience you can scroll through.
ROLE
Solo Designer and Developer
TEAM
1 Designer (Me)
TIMELINE
2 days
WHAT I DID
- •Identified one section to intervene in, rebuilt it as a coded interactive prototype, kept the rest of the page out of scope
CONTEXT
Directed research, one of 25 website redesigns completed over the semester
TOOLS
HTML, CSS, JavaScript
Left, Meta's current section. Right, the redesigned section, live at View the redesign
THE CHANGE
I did not set out to redesign the whole Instagram page on Meta's site, only the second section.
In the original, that section introduces Instagram with a static image of a Story. It tells you what Instagram is, but it does not feel like using it.
I rebuilt that one section as a scroll driven phone. As you move down the page, you move through the app itself: the feed, a photo carousel, liking a post, opening comments, and opening the share sheet. The interaction is the point. Scrolling the website starts to feel like scrolling Instagram.
That does a better job of showing what the page is trying to claim, that Instagram is about experience and community, because you see people posting, responding, and sharing instead of reading about it next to a frozen image.
REFLECTION
A 2 day limit kept the scope honest: one section, one idea, built in code instead of mocked up. I would keep future redesigns in this series the same way.