My UX Tool Skills
My UX Tool Skills
Showcasing how I apply design tools and techniques to improve efficiency, ensure design consistency, and create effective user experiences.
Showcasing how I apply design tools and techniques to improve efficiency, ensure design consistency, and create effective user experiences.
Responsive
Animate
Prototyping
Responsive
Animate
Prototyping
Responsive
Animate
Prototyping
How does prototyping help me validate My Ideas?
How does prototyping help me validate My Ideas?
Let me show you with examples from my projects how prototyping played a crucial role in validating my ideas and refining interactions.
Let me show you with examples from my projects how prototyping played a crucial role in validating my ideas and refining interactions.
Project: VirtuFit for Myntra
Project: VirtuFit for Myntra
How did prototyping help validate the VirtuFit concept?
How did prototyping help validate the VirtuFit concept?
The VirtuFit project was a concept I developed to explore the potential of virtual try-ons for online shopping. Although it wasn’t intended for actual development, I approached it with the same rigor as a real product.
The VirtuFit project was a concept I developed to explore the potential of virtual try-ons for online shopping. Although it wasn’t intended for actual development, I approached it with the same rigor as a real product.
What did I do?
What did I do?
I created a high-fidelity interactive prototype that simulated the virtual try-on experience. It wasn’t just about visuals; the prototype mimicked the app's functionality, letting users explore the flow as if it were a real app.
I created a high-fidelity interactive prototype that simulated the virtual try-on experience. It wasn’t just about visuals; the prototype mimicked the app's functionality, letting users explore the flow as if it were a real app.
Interactive prototype of VirtuFit
Interactive prototype of VirtuFit
How did prototyping help?
How did prototyping help?
How did prototyping help in making the concept clear?
How did prototyping help in making the concept clear?
Explaining a virtual try-on concept could easily get complicated with just words or static screens. But with the prototype, I didn’t have to explain much. People could tap through, see how it worked, and instantly understand the idea. It felt real, almost like using the actual app. This made the idea clearer and avoided any confusion about how it would work.
Explaining a virtual try-on concept could easily get complicated with just words or static screens. But with the prototype, I didn’t have to explain much. People could tap through, see how it worked, and instantly understand the idea. It felt real, almost like using the actual app. This made the idea clearer and avoided any confusion about how it would work.
VirtuFit Prototype
VirtuFit Prototype
How did prototyping help test if the idea worked?
How did prototyping help test if the idea worked?
I used this prototype to see how users interacted with the virtual try-on. Where did they struggle? Was something not working as they expected? These moments told me what needed to change. Users also shared feedback, pointing out things that were confusing or could be smoother.
I used this prototype to see how users interacted with the virtual try-on. Where did they struggle? Was something not working as they expected? These moments told me what needed to change. Users also shared feedback, pointing out things that were confusing or could be smoother.
Why was prototyping for VirtuFit important?
Why was prototyping for VirtuFit important?
For a concept like VirtuFit, which introduces something relatively new to Indian shoppers, the prototype bridged the gap between an idea and a vision. It became a tool not just for design exploration but also for storytelling and communicating the value of the concept.
For a concept like VirtuFit, which introduces something relatively new to Indian shoppers, the prototype bridged the gap between an idea and a vision. It became a tool not just for design exploration but also for storytelling and communicating the value of the concept.
Prototypes from My other projects
Prototypes from My other projects
Okkular+ (AI Stylist) prototype
Okkular+ (AI Stylist) prototype
Shop The Look prototype
Shop The Look prototype
Okkular Dashboard prototype
Okkular Dashboard prototype
Disney+ Hotstar prototype
Disney+ Hotstar prototype
For me, prototyping isn’t just a step in the process, it’s how I turn ideas into experiences people can truly connect with.
For me, prototyping isn’t just a step in the process, it’s how I turn ideas into experiences people can truly connect with.
How does auto layout help me minimize manual adjustments?
How does auto layout help me minimize manual adjustments?
By using Auto Layout, I’m able to increase efficiency and streamline the design process. Rather than manually adjusting each element, I set flexible constraints for spacing, alignment, and resizing. This allows the layout to automatically adapt when content or screen sizes change, saving time and reducing manual adjustments. It also ensures consistent designs across different devices and screen resolutions, requiring minimal effort to maintain.
By using Auto Layout, I’m able to increase efficiency and streamline the design process. Rather than manually adjusting each element, I set flexible constraints for spacing, alignment, and resizing. This allows the layout to automatically adapt when content or screen sizes change, saving time and reducing manual adjustments. It also ensures consistent designs across different devices and screen resolutions, requiring minimal effort to maintain.
Auto layout on the VirtuFit screens
Auto layout on the VirtuFit screens
Auto layout on VirtuFit screens
Auto layout on VirtuFit screens
Auto layout on Shop The Look screen
Auto layout on Shop The Look screen
How do components and variants simplify my design work?
How do components and variants simplify my design work?
Components and variants are integral to my workflow, allowing me to create a consistent and scalable design system. By designing reusable components, I can maintain uniformity across screens while saving time on repetitive tasks. Variants take this further by enabling multiple states, like hover, active, or disabled within a single component.
For example, in the Okkular project, I used components to create buttons, cards, and dropdowns, ensuring design consistency across the feature. Variants helped me manage different button states without duplicating components, making the design more organized and easier to update.
Components and variants are integral to my workflow, allowing me to create a consistent and scalable design system. By designing reusable components, I can maintain uniformity across screens while saving time on repetitive tasks. Variants take this further by enabling multiple states, like hover, active, or disabled within a single component.
For example, in the Okkular project, I used components to create buttons, cards, and dropdowns, ensuring design consistency across the feature. Variants helped me manage different button states without duplicating components, making the design more organized and easier to update.
Components and variants in okkular web app
Components and variants in okkular web app
Components and variants in okkular web app
Components and variants in okkular web app
Components and variants in okkular web app
Components and variants in okkular web app
What more can I do with components and variants?
What more can I do with components and variants?
In my project, I used variants to create internal prototypes that closely mimicked real user interactions. This helped communicate the concept more effectively and refine the user flow before moving to development.
In my project, I used variants to create internal prototypes that closely mimicked real user interactions. This helped communicate the concept more effectively and refine the user flow before moving to development.
