Realism.
Realism.
Augmented Reality Fashion App
Augmented Reality Fashion App
Category
Category
Mobile App
Mobile App
FashionTech
FashionTech
Role
Role
UI Designer
UI Designer
Team
Team
Part of the Software Engineering Competition 2025 (SECOMP 2025). Team pedjoang bipol covered UI/UX design, research, and prototyping. Sadly did not advance to the final round.
Part of the Software Engineering Competition 2025 (SECOMP 2025). Team pedjoang bipol covered UI/UX design, research, and prototyping. Sadly did not advance to the final round.
Overview
Overview
Realism. is a mobile AR fashion app that connects physical products to digital expression through phygital collectibles. When customers purchase from partner brands, they scan an exclusive QR code to unlock an R Item, a product‑themed AR filter tied to that garment, accessory, or collaboration.
Users can apply filters for selfies and social content, build a personal collection, and engage with a like‑minded community. Aimed at Gen Z and Millennials, Realism is not a marketplace; it is a platform for appreciation, collection, and community, emphasizing exclusivity for verified owners with a modern, intuitive, visual‑first interface and an immersive, interactive experience.
Realism. is a mobile AR fashion app that connects physical products to digital expression through phygital collectibles. When customers purchase from partner brands, they scan an exclusive QR code to unlock an R Item, a product‑themed AR filter tied to that garment, accessory, or collaboration.
Users can apply filters for selfies and social content, build a personal collection, and engage with a like‑minded community. Aimed at Gen Z and Millennials, Realism is not a marketplace; it is a platform for appreciation, collection, and community, emphasizing exclusivity for verified owners with a modern, intuitive, visual‑first interface and an immersive, interactive experience.
Problems
Problems
Fashion is shifting to phygital and digital identity, driven by AR, digital collectibles, and visual social platforms. Gen Z and Millennials value exclusivity and credible digital expression, yet most solutions favor large brands. Small and medium brands lack a simple way to link physical products to verified digital ownership and immersive community experiences. This creates fragmented journeys, unclear proof of ownership, and lost post purchase engagement and retention.
Fashion is shifting to phygital and digital identity, driven by AR, digital collectibles, and visual social platforms. Gen Z and Millennials value exclusivity and credible digital expression, yet most solutions favor large brands. Small and medium brands lack a simple way to link physical products to verified digital ownership and immersive community experiences. This creates fragmented journeys, unclear proof of ownership, and lost post purchase engagement and retention.
Goal
Goal
Create a mobile UI/UX that bridges physical fashion and digital collectibles through QR activation and AR filters, with a community and collection catalog, to engage young consumers and prototype a credible, inclusive digital fashion experience.
Create a mobile UI/UX that bridges physical fashion and digital collectibles through QR activation and AR filters, with a community and collection catalog, to engage young consumers and prototype a credible, inclusive digital fashion experience.
Design System
Design System
In this section, I created the design system as the main brand guideline and product structure: standardized color styles (with clear roles), typography scales and usage, the icon set, a reusable component library with states and variants. This serves as a single source of truth for design and development, keeping the experience consistent and speeding up delivery.
In this section, I created the design system as the main brand guideline and product structure: standardized color styles (with clear roles), typography scales and usage, the icon set, a reusable component library with states and variants. This serves as a single source of truth for design and development, keeping the experience consistent and speeding up delivery.
Information Architecture
Information Architecture
The information architecture organizes Realism into six hubs: Home, Explore, QR Scan, AR Camera, Inventory, and Profile, preceded by Splash and Login. Home links to brand and product catalog and recommendations. Explore shows the feed and feed details. QR Scan unlocks R Items with QR and confirmation. AR Camera offers item based filter preview, save to gallery, and upload to feed. Inventory lists owned R Items with rarity details. Profile contains user info, collection count, posts, and followers or following. The structure keeps the phygital flow clear from unlock to creation and sharing with shallow, task focused paths.
The information architecture organizes Realism into six hubs: Home, Explore, QR Scan, AR Camera, Inventory, and Profile, preceded by Splash and Login. Home links to brand and product catalog and recommendations. Explore shows the feed and feed details. QR Scan unlocks R Items with QR and confirmation. AR Camera offers item based filter preview, save to gallery, and upload to feed. Inventory lists owned R Items with rarity details. Profile contains user info, collection count, posts, and followers or following. The structure keeps the phygital flow clear from unlock to creation and sharing with shallow, task focused paths.
Wireframe
Wireframe
We created low fidelity wireframes to map the core journeys from onboarding to expression. Screens cover QR scan to activate an R Item, AR camera preview, brand and product catalog with item details, digital inventory with ownership and rarity, community feed and gallery, and profile. The flow shows a clear path from unlocking an item to creating and sharing content.
We created low fidelity wireframes to map the core journeys from onboarding to expression. Screens cover QR scan to activate an R Item, AR camera preview, brand and product catalog with item details, digital inventory with ownership and rarity, community feed and gallery, and profile. The flow shows a clear path from unlocking an item to creating and sharing content.
UI Design
UI Design
The UI is modern, intuitive, and visual first. It highlights QR activation states, product pages with AR previews, a clean catalog for browsing brands, an inventory that shows owned items and rarity, a community feed for sharing, and a simple profile as a style portfolio. The look supports exclusivity for verified owners and encourages creative expression.
The UI is modern, intuitive, and visual first. It highlights QR activation states, product pages with AR previews, a clean catalog for browsing brands, an inventory that shows owned items and rarity, a community feed for sharing, and a simple profile as a style portfolio. The look supports exclusivity for verified owners and encourages creative expression.
Prototype
Prototype
We built a high fidelity interactive prototype covering QR activation of an R Item, AR camera preview and capture, save and share to the feed, browse and view products in the catalog, manage items in the inventory, and view the profile. Core interactions, transitions, and states are clickable end to end to reflect real use.
We built a high fidelity interactive prototype covering QR activation of an R Item, AR camera preview and capture, save and share to the feed, browse and view products in the catalog, manage items in the inventory, and view the profile. Core interactions, transitions, and states are clickable end to end to reflect real use.