Catalog Page for Smartwatch Mobile App

Welcome to my Smartwatch catalog design. I have chosen smartwatch products, and I decided to design for mobile this time because I am still a beginner. This is one of my first experiences in app design.

Friction Points Addressed:

One major friction point users often encounter is the efficiency of search. I've optimized my search functionality to ensure you find exactly what you're looking for quickly and effortlessly.

Filtering and sorting:

When I searched across smartwatch properties, I found many features. I chose them based on factors such as spread and importance, and I grouped some properties similar to what I did with the health features. Since I found many properties associated with health, including heart rate monitoring, blood oxygen monitoring, sleep tracking, and activity tracking (e.g., steps taken, distance traveled, calories burned). So we have the following properties.

General properties: Brand, price, Color

Compatibilities (System of the watch IOS, Android ...etc)

Battery life

Case size

Strap material

Smart Features:

GPS, Water resistance

Health features

Another consideration is to arrange these properties in the filter. We need to keep in mind important factors, such as their high impact on purchase decisions, so I believe prioritizing them is essential. Finally, we have the following list:

1. Compatibility (System of the watch IOS, Android ...etc)
2. Price
3. Brand
4. Smart Features (Water Resistance, GPS, and Health Features)
5. Case Size
6. Strap Material
7. Colors
8. Battery Life

Regarding sorting, I see that only two properties would be helpful: Price and Battery Life (in days or hours).

Visual Design:

Now let's talk a bit about the implementation... and we start with the main components... smartwatch card... as you can see, I tried to do something simple and useful... Product name, price, and a little details...

In the implementation of the filter, I tried to apply what I learned in the design pattern of filters...

The overall design doesn't look consistent in spacing because I still don't have experience with the 8-grid rules

That's all. I'm eagerly awaiting your reviews.