# myshoesapp

- A shoes app UI using Flutter 
- Sign in/Sign out using Firebase :
  - Google account 
  - Phone authentication

## The App

### Login Page

<kbd><img src="https://user-images.githubusercontent.com/109909231/224124655-c204c34f-1fb6-4b98-ab99-e2ad4b317dc7.png" width="250" height="550"></kbd>

___


### Phone Verfication Page [ if tapped on phone icon ]

#### Input Valid Number

<kbd><img src="https://user-images.githubusercontent.com/109909231/224324664-621b6e7d-82ef-41f1-8808-09aa5755782d.png" width="250" height="550"></kbd>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<kbd><img src="https://user-images.githubusercontent.com/109909231/224324765-ee5bf3dc-d5c4-42ac-a270-511c6ff2def8.png" width="250" height="550"></kbd>
____
#### Enter OTP
<kbd><img src="https://user-images.githubusercontent.com/109909231/224324969-8d9ad9be-943d-4f00-95c4-8ea5d3b23e37.png" width="250" height="550"></kbd>

____


### Home Page [design](https://dribbble.com/shots/17480773-NWS-Mobile-App-Exploration)
<kbd><img src="https://user-images.githubusercontent.com/109909231/224124850-62015ed7-3365-4b0a-aeea-82f06e0ddad3.png" width="250" height="550"></kbd> 
____


### Shoe Details Page [design](https://dribbble.com/shots/17480773-NWS-Mobile-App-Exploration)

- Names of the products are different as they were passed dynamically.

- The aim was to make the Select Color feature work.

<kbd><img src="https://user-images.githubusercontent.com/109909231/224124780-a0f2c253-3bb1-4b28-a242-e413e1a5da54.png" width="250" height="550"></kbd>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<kbd><img src="https://user-images.githubusercontent.com/109909231/224127441-cb47236b-0a05-4715-a945-cf05776c67b1.png" width="250" height="550"></kbd>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<kbd><img src="https://user-images.githubusercontent.com/109909231/224128688-0a77f982-91ff-4f03-a058-428b185d7e4a.png" width="250" height="550"></kbd>

<kbd><img src="https://user-images.githubusercontent.com/109909231/224127650-4ff336ad-9228-4621-8a86-a9498f00ca4a.png" width="250" height="550"></kbd>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<kbd><img src="https://user-images.githubusercontent.com/109909231/224127528-4559c98c-1adc-44e9-9adf-6343ca8f41ba.png" width="250" height="550"></kbd>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<kbd><img src="https://user-images.githubusercontent.com/109909231/224128799-14c576d6-e91a-453c-b465-72b76c8be8d8.png" width="250" height="550"></kbd> 
____


### Drawer

<kbd><img src="https://user-images.githubusercontent.com/109909231/224129246-3f5da217-fe81-40ee-80bb-fd67ba2c3e43.png" width="250" height="550"></kbd>
____


### Alert Dialog

<kbd><img src="https://user-images.githubusercontent.com/109909231/224129398-de440f54-072d-4c7f-9d98-ff89862b76f8.png" width="250" height="550"></kbd>


This project was made for practice and is still under development. Open to suggestions/feedback :) 
