DateTime Picker

DateTime Picker is a component that enables the setup time range.

The Challenge

How to easily setup range in one window (values From – To).

Discovery & Research

User interviews

I conducted user interviews to dive deeper into the needs of users. By learning about their needs, motivations, and frustrations, I was able to gain user insights.

Wireframing the solution

Based on the above problems identified, I worked towards addressing these pains by coming up with potential solutions.

Developing the designs

I created my high-fidelity mockups in Adobe XD.

Date time picker cover


I have received positive feedback from users about the simplified picking date range.



Discovery and research

Competitor analysis

Low-fidelity wireframes and prototypes

High-fidelity designs and asset creation

Usability testing and validation

Design workflow management

Providing direction to the development team


2019 (1m)

Design Tools

Adobe XD