👨‍💻 About the projects

I meticulously recreated Instagram with a focus on precision, user-centric design, and seamless functionality. My goal was an immersive user journey, aligning every pixel and interaction with the platform’s ethos, going beyond visual replication to enhance the user experience. This involved an exhaustive study of user needs, rigorous design consistency, and an unwavering dedication to authenticity and improvement.

Role

UI Design

Tools

Figma

Team

Individual

Year

2022

🙇🏻 The challenge

Recreating Instagram in Figma posed UX/UI challenges, including replicating complex features, maintaining pixel-perfect consistency, and ensuring responsive design across devices. Implementing interactive elements and staying updated with Instagram’s changes added complexity. A user-centric approach required balancing familiarity with potential enhancements, demanding a deep dive into user behavior analysis and meticulous design implementation. Overcoming these challenges honed technical skills and deepened understanding of user-centric design principles.
🔬

👇 Key Features:

  • Content Sharing: Upload photos and videos with editing, filters, captions, tags, and locations.
  • Stories: Share temporary content with stickers, text, drawings, and interactive elements.
  • Direct Messaging (DMs): Privately message individuals or groups, share content, and engage in separate conversations.
  • Reels: Create and share 15- to 60-second videos with music, effects, and editing tools.
  • Live Video: Broadcast live content, interact in real-time, and host Q&A sessions or events.
  • Reactions: Engage with posts through likes, comments, and saves.

These tools define Instagram’s diverse user experience, meeting content creation, communication, and discovery needs.

Primary task flow

📱 Primary Task Flow

The user launches the app , where he choose to comment a post. Then user opened Direct message page and decided to reply to a story shared.

Profile create a story flow

🤳 Create a story

This secondary task flow the user are creating a new story clicking in top right menu navigation.

Reels flow

🤳 Reels flow

In profile user, the user are creating a new reel clicking in top right menu navigation. User are publishing the reel and explore new reels.

Comments and notification screen

💬 Comments and notification screen

Users  have the ability to comment a post and to get notified from activity happened in user account.

New post

📷 New post

Users can create new post, it will be posted directly in the feed and in profile users.

Profile flow

👤 Profile flow

In profile user, the user have different views. The user can navigate to reels, scrolling post page, following,edit profile and much more.

Web view

🖥️ Web view

Users have the ability to use instagram directly from the website but with less features.

🎨

Jaldi

Light

Regular

Semi Bold

Bold

ABCDEFGHIJKLMNOPQRSTUVWXYZ

123456789

Instagram