top of page
A photo sharing app.
Manualgram.
I developed Manualgram, a solo app project for smartphone photography enthusiasts and photographers. The app's design is super clean and minimal, inspired by a combination of Instagram and Unsplash.
Despite the prototype's complexity, the app turned out amazing, cool, and functional.
I had a great time designing this.
Watch the Walkthrough
On YouTube.
The app has a forced Whiteout colour theme, with minimal UI colour focusing on Pure white, White and/or Gradients. Text elements are grey or black. The idea was for the app to be ‘Anti Dark Mode’.
The other reason for having a whiteout colour theme is to give focus to users’ photography, almost mimicking an art gallery or a Polaroid print. This idea was gained through user research and a personal choice from a designer who is challenging themselves to think simple, and minimal.
Apple’s SF Pro Display was used, as the app is optimized for iPhones, and thus having a font that is consistent with Apple’s UI would achieve a clean look for the app. The typeface also has many variable weights, which were taken advantage of throughout the app.
Design Flow
Design flow is crucial in app design on Figma. Going through the phases of wireframing, low fidelity, high fidelity, and prototype ensures a smooth and efficient design process. Each phase builds upon the previous one, resulting in a well-designed and functional app.
Information
Architecture
Low
Fidelity
High
Fidelity
Manual Camera UI Prototype
One of the app's most important features is its Manual Camera, which is heavily inspired by real cameras and the Sony Xperia 1 IV’s Manual Camera App.
Each camera component was meticulously prototyped to be interactive, with the limitations of Figma kept in mind.
UI Teardown
A tear down of all the components that make up the Manual Camera feature of Manualgram. Each element was designed and prototyped to be interactable.
Components
All of the components such as buttons are a part of the prototype, These buttons have their instances and custom interactive settings/ animations.
Download the Full Report
Take a look at all the documentation, rationale, design thought process and also user research I've conducted in the full report of Manualgram!
Want to download my condensed
UI/UX portfolio?
click on the floating icon above
bottom of page