Back to list

#UI Prototypes

#Interactions

#Transitions

#Micro Animations

UX Motion Design

UX Motion Design

UX Motion Design

UX Motion Design

UX Motion Design

UX Motion Design

Making UX flows responsive, easy and fun with the help of better motion and interaction design.

Making UX flows responsive, easy and fun with the help of better motion and interaction design.

Making UX flows responsive, easy and fun with the help of better motion and interaction design.

Making UX flows responsive, easy and fun with the help of better motion and interaction design.

Making UX flows responsive, easy and fun with the help of better motion and interaction design.

Making UX flows responsive, easy and fun with the help of better motion and interaction design.

Tabs:

  1. Tabs appears from left to right which gives a hint of more tabs exists outside of viewport and animation bring back the eye flow to the first tab.

  2. When user tap on 4th or 5th tab it moves to center.

Tabs:

  1. Tabs appears from left to right which gives a hint of more tabs exists outside of viewport and animation bring back the eye flow to the first tab.

  2. When user tap on 4th or 5th tab it moves to center.

Tabs:

  1. Tabs appears from left to right which gives a hint of more tabs exists outside of viewport and animation bring back the eye flow to the first tab.

  2. When user tap on 4th or 5th tab it moves to center.

Tabs:

  1. Tabs appears from left to right which gives a hint of more tabs exists outside of viewport and animation bring back the eye flow to the first tab.

  2. When user tap on 4th or 5th tab it moves to center.

Tabs:

  1. Tabs appears from left to right which gives a hint of more tabs exists outside of viewport and animation bring back the eye flow to the first tab.

  2. When user tap on 4th or 5th tab it moves to center.

Tabs:

  1. Tabs appears from left to right which gives a hint of more tabs exists outside of viewport and animation bring back the eye flow to the first tab.

  2. When user tap on 4th or 5th tab it moves to center.

Scroll and pull down:

  1. Location header disappear when scrolled up, and glossy effect of content behind the header.

  2. When pulled down, it activate the search bar and bring out the keypad.

Scroll and pull down:

  1. Location header disappear when scrolled up, and glossy effect of content behind the header.

  2. When pulled down, it activate the search bar and bring out the keypad.

Scroll and pull down:

  1. Location header disappear when scrolled up, and glossy effect of content behind the header.

  2. When pulled down, it activate the search bar and bring out the keypad.

Scroll and pull down:

  1. Location header disappear when scrolled up, and glossy effect of content behind the header.

  2. When pulled down, it activate the search bar and bring out the keypad.

Scroll and pull down:

  1. Location header disappear when scrolled up, and glossy effect of content behind the header.

  2. When pulled down, it activate the search bar and bring out the keypad.

Scroll and pull down:

  1. Location header disappear when scrolled up, and glossy effect of content behind the header.

  2. When pulled down, it activate the search bar and bring out the keypad.

Setup widget flow:

  1. Insight: If user setup 3 key features, they tend to be more active on the app

  2. We created a To Do type widget where user keep completing these flow/task

  3. On clicking 2,3 task, it takes user into the flow with card expansion and exit out at same place which keep them connected to the flow and a delight element on each step done.

Setup widget flow:

  1. Insight: If user setup 3 key features, they tend to be more active on the app

  2. We created a To Do type widget where user keep completing these flow/task

  3. On clicking 2,3 task, it takes user into the flow with card expansion and exit out at same place which keep them connected to the flow and a delight element on each step done.

Setup widget flow:

  1. Insight: If user setup 3 key features, they tend to be more active on the app

  2. We created a To Do type widget where user keep completing these flow/task

  3. On clicking 2,3 task, it takes user into the flow with card expansion and exit out at same place which keep them connected to the flow and a delight element on each step done.

Setup widget flow:

  1. Insight: If user setup 3 key features, they tend to be more active on the app

  2. We created a To Do type widget where user keep completing these flow/task

  3. On clicking 2,3 task, it takes user into the flow with card expansion and exit out at same place which keep them connected to the flow and a delight element on each step done.

Setup widget flow:

  1. Insight: If user setup 3 key features, they tend to be more active on the app

  2. We created a To Do type widget where user keep completing these flow/task

  3. On clicking 2,3 task, it takes user into the flow with card expansion and exit out at same place which keep them connected to the flow and a delight element on each step done.

Setup widget flow:

  1. Insight: If user setup 3 key features, they tend to be more active on the app

  2. We created a To Do type widget where user keep completing these flow/task

  3. On clicking 2,3 task, it takes user into the flow with card expansion and exit out at same place which keep them connected to the flow and a delight element on each step done.

Page opening and nudges:

  1. Most imp info i. Change in Data ii. Soon expiring service
    Showing change in data, from user last checked to current data

  2. After page opening transition data change from 90 to 50 mb
    Later playing micro-animation on “7 days” tag to grab attention which is soon expiring service.

Page opening and nudges:

  1. Most imp info i. Change in Data ii. Soon expiring service
    Showing change in data, from user last checked to current data

  2. After page opening transition data change from 90 to 50 mb
    Later playing micro-animation on “7 days” tag to grab attention which is soon expiring service.

Page opening and nudges:

  1. Most imp info i. Change in Data ii. Soon expiring service
    Showing change in data, from user last checked to current data

  2. After page opening transition data change from 90 to 50 mb
    Later playing micro-animation on “7 days” tag to grab attention which is soon expiring service.

Page opening and nudges:

  1. Most imp info i. Change in Data ii. Soon expiring service
    Showing change in data, from user last checked to current data

  2. After page opening transition data change from 90 to 50 mb
    Later playing micro-animation on “7 days” tag to grab attention which is soon expiring service.

Page opening and nudges:

  1. Most imp info i. Change in Data ii. Soon expiring service
    Showing change in data, from user last checked to current data

  2. After page opening transition data change from 90 to 50 mb
    Later playing micro-animation on “7 days” tag to grab attention which is soon expiring service.

Page opening and nudges:

  1. Most imp info i. Change in Data ii. Soon expiring service
    Showing change in data, from user last checked to current data

  2. After page opening transition data change from 90 to 50 mb
    Later playing micro-animation on “7 days” tag to grab attention which is soon expiring service.

Tools

Tools

After effects

Figma

Rive

Create a free website with Framer, the website builder loved by startups, designers and agencies.