01
About The Project
This project is about making Instagram , that app that we all love
Also available on desktop as an app and not as a website like it is.
This project first started with the idea of making Instagram Direct also
Available on desktop. The second stage was when I wanted to redesign the Instagram app
Also on the Smartwatch.
Also on the Smartwatch.
02
Fonts & Colors
For this project I was using one font only.
The font is used by Apple and looks very
Professional so this was the reason why I chose this Font specially.
03
The Problem
As someone who uses Instagram a lot,I was always thinking , why they have no normal ,
Good looking app for desktop.There is no Instagram app for PC / Mac who contains
Dm , Feed , IGTV & Settings and more.
When I was studying UX/UI , we had some homework :"Create a messaging app for desktop"
And then I thought , why not making an Instagram app and
Optimise it to desktop.
Good looking app for desktop.
Dm , Feed , IGTV & Settings and more.
Optimise it to desktop.
04
Solution
For this project I was using one font only.
The font is used by Apple and looks very
Professional so this was the reason why I chose this Font specially.
05
The Persona
The persona that u was based on is a person who
Loves Instagram and gets influences from this app , someone who
Uses desktop and wants to experience Instagram on his own computer Also.
06
Wireframes
Wireframing is a way to design a website service
At the structural level. A wireframe is commonly used to layout content and Functionality on a page which takes into account user
Needs & user journeys.
Needs & user journeys.
General Info
#1
The app is basically one pager.
You can control everything from the homepage.As its possible to see , the screen is divided to 4 sections ,
The first section is for your own profile , where you can control your activity ,
Watch all of your conversations (Dm) , you can promote yourself through desktop also ,Control all settings & Watch full IGTV clips.
The first section is for your own profile , where you can control your activity ,
Watch all of your conversations (Dm) , you can promote yourself through desktop also ,
#2
The Feed
The second section is a section who
Contains the feed of your personal Instagram.Same as the mobile one ,
Nothing changed.
Nothing changed.
#3
Messenger / Dm
The last section is what all this app was based about.
Messenger at desktop , you can choose to talk with your Friends and dive in to your requests box ,You can choose to send images , watch stories . Record audio messages and watch videos.
Smart Watch
#4
Re designing the app for the smartwatches was a very
Fun part of this project.
I have made the app more responsive and less complicated
For the user to enjoy the app.The design is based with big circles which fit to your
Fingers without you making a mistake and press the wrong
Thing.
Fingers without you making a mistake and press the wrong
Thing.
07
Design & Mockups
Final design,Designed for Dark mode & Light modeFor both watch and pc.
Design
Desktop App
Registration / Login screen for the application.
Reminds Instagram web , A new design for the Login page , There is an option to access the account via Facebook.Dark mode version.
Smart
Watch
Redesigning the smart watch
Version for Instagram.
Better performance .
Easier navigation.
Better swiping system.
Friendly messaging
system.
Versions
Dark mode
A clean dark mode version of the Instagram app.
Green & Orange Instagram colors which fit so well
To the dark mode version , another treat for
The users.
Light
Mode
Light mode with classic colors.
Now you don't need to haveyour phone with you all the time.
Better way to explore Instagram.
Quick updates straight
to your app.
