UX to UI Amruta K's Journal

UX & Me

My Name : Amruta K.

I am from Mumbai, India.

UX According to me

User experience design is the process of enhancing user satisfaction with a product by improving the usability & pleasure provided in the interaction with the product.


I never used Adobe 'Experience Design Beta'. So first time I am using this tool to make persona. I wish to be expert in it.



A site map is a list of pages of a web site. I am working for a online grocery firm called DMart Ready. This is a well known firm in India. Three sections are very important in this site. So I tried to make site map with only three section by using Experience Design Beta Tool. I used Prototype option 1st time.

I really Thank 'Mark' for the session. I learned many things from it. Also I am looking to make more professional sitemap & prototype by using Experience Design.

Wire Frame

First time I have sketched wireframe. I am planning a DMart Ready E- commerce app's Product landing page (PLP) structure and functionality. Initially PLP was designed with all details, Add to Cart (CTA) on upfront. So user were able to see hardly two and half products on screen. According to business at a glance minimum 3-4 product should appear upfront.

Here I redesigned the page and introduced 'Get more' option with arrow. Now in updated design user will get to see 3 & half products at a glance, also by clicking 'Get more' option they are able to add product in cart with the variant. Multiple selection is a very important element in Grocery business. Here I tried to provide that option in a easy way. Now user will come to know clearly that how much quantity they are purchasing of particular variant. User have feasibility to add or remove products any time.

Sketch of wireframe
Wireframe by using Adobe Experience Design Tool

Moodboard (Splash Screen for App)

Moodboard is nothing but the an arrangement of images, materials, pieces of text, etc. intended to evoke or project a particular style or concept. For 'DMart Ready' Grocery is the main business. So I decided to select theme as per that. DMart's colour theme is mainly 'Goblin Green', 'Fun Green', 'Orange red' & related these colours. I made cool and subtle colour theme & decided to use iconography instead images to maintain light wait design. As per the demand I added registration process by using same artwork as a background.

Selecting & making icons becomes bit gruelling task. Users often rely on familiar patterns. Thank you Adobe for giving information about it. I was knew of this process but not aware that this is called 'Moodboard'. Now onwards it becomes easy & interesting to work on Moodboard.

Colours & iconography
Splash Screen
Splash Screen with Registration

Final Flow

And here is my final flow... Throughout the course I learn many things. Most important is I did hands on 'Experience Design Tool'. Wire framing, Prototype, Moodboard etc information made me more skilful. User designer have to meet and balance both the business needs and user needs.

This task is about 'DMart Ready' Online Grocery app. Adobe's User Experience Design, UX to UI course helped me to make such final flow of app. I made flow of app with only one section called PLP (Product landing page). This is very important page for business as well as for users.

Challenges: Product landing page have details as fallow:

  • Product Image
  • Product Name
  • Product Brand Name
  • Product prise
  • DMart's prise
  • User's saving amount
  • Product variant option
  • Add to 'My List' option
  • Add to Cart button(CTA)

Design PLP with all these options were bit challenging. Also business need was showing more than 3 products at a glance. I have done lots of study for this. Gone through different grocery apps, done the survey and come up with new design.

Problem Solving: I redesigned the page and introduced 'Get more' option with arrow. Now user will be able to see more than 3 products at a glance. "Get more" option keep them engaging with Product card. User have feasibility to add or remove products any time with variety of product.

Final Reflection:

This UX to UI course study has been a challenging and rewarding experience for me. I joined this course very late, thank you Adobe for opening the door of this course again. A successful UX designer should be able to see their web design through the lens of an actual user to be able to enhance the user experience of the viewers and boost engagement. Things start to go down the drain when UX designers start assuming that website users behave and think like they do. I gain my knowledge about all this due to this course. I dig a deep about UX & UI. While doing more study about this I came to know that 'User-centric design' is king when it comes to user experience.

After a long time I have done such a e-course. I explored "Experience Design Tool". Not only did I get to exercise my UX skills, I was also able to make a positive impact with the proposed changes for Grocery E- commerce company, DMart Ready. I used my creativity, discovered some facts about Grocery app design, user's need & tried to solve the problem. Made the changes base on all brainstorming, I hope that people will be able to explore their needs with ease! Now I will start working on other pages of app...

I still expect more from Adobe. Wish to do more detailed courses for working professionals. At the end Adobe's learning process, platform and certification matter a lot. Hoping the best possibility...

Report Abuse

If you feel that this video content violates the Adobe Terms of Use, you may report this content by filling out this quick form.

To report a Copyright Violation, please follow Section 17 in the Terms of Use.