Block Diagram
Login service
The login page is used to authenticate the user's identity. In the login page, the user can choose to login with an existing userID and password or sign up a new user ID. The backend service for login page is the AWS dynamoDB. In the dynamoDB, a table called Users is used to store the username and hash of password information.
If the user wants to sign up a new user name, the user enters the username and password in the two input text boxes and click sign up. The password is hashed using SHA-1 hashing algorithm to ensure password security. The username and hash is then inserted to the database.
To login in to the app, the user needs an existing username and password. Upon authentication, the user inputs the username and password. Then the corresponding hash of the username is pulled from the database. If the hash of local input password matches the fetched hash information, then the authentication is successful, otherwise ask the user to input again.
The user will have three chances to input the right password, otherwise the button will freeze.
The login page is used to authenticate the user's identity. In the login page, the user can choose to login with an existing userID and password or sign up a new user ID. The backend service for login page is the AWS dynamoDB. In the dynamoDB, a table called Users is used to store the username and hash of password information.
If the user wants to sign up a new user name, the user enters the username and password in the two input text boxes and click sign up. The password is hashed using SHA-1 hashing algorithm to ensure password security. The username and hash is then inserted to the database.
To login in to the app, the user needs an existing username and password. Upon authentication, the user inputs the username and password. Then the corresponding hash of the username is pulled from the database. If the hash of local input password matches the fetched hash information, then the authentication is successful, otherwise ask the user to input again.
The user will have three chances to input the right password, otherwise the button will freeze.
Optional Menu Activity
The optional menu activity is displayed after the login authentication succeeded. User will be asked to
Insert New Clothes
The insert clothes activity is where the user uploads new clothes to the database.
First the user clicks the camera button to insert a new photo. The photo is taken via the default camera app. After the photo is taken, a file uri correspond to the photo will be saved.
After the photo has been taken, a color detection API called ColorTag is used to detect the color of clothes. It will detect the dominant color in the picture, thus the color of the clothes. The API returns the color in String and in RGB value. The String value is display in the third spinner, and the RGB value is used by the machine learning API.
The file uri is then used as the primary key for the clothes in database since it's unique. The clothes style, the clothes color, the color value and the username of the current user are passed to dynamoDB as an entry.
The insert clothes activity is where the user uploads new clothes to the database.
First the user clicks the camera button to insert a new photo. The photo is taken via the default camera app. After the photo is taken, a file uri correspond to the photo will be saved.
After the photo has been taken, a color detection API called ColorTag is used to detect the color of clothes. It will detect the dominant color in the picture, thus the color of the clothes. The API returns the color in String and in RGB value. The String value is display in the third spinner, and the RGB value is used by the machine learning API.
The file uri is then used as the primary key for the clothes in database since it's unique. The clothes style, the clothes color, the color value and the username of the current user are passed to dynamoDB as an entry.
Display Match Result
When the user wants to display the clothes choice, he can simply enter the display result activity.
In the display match page, the app will display current weather and temperature. The temperature is one attribute in the decision of color outputs. Once the user clicks the display match button, the app will display a top and a bottom choice in the two image views. If the user is not satisfied with the current choice, he can always click the button again to get another output. The above screen shots are three sample outputs on that day.
Matching algorithm
In our matching algorithm, two attributes are the key roles in determine the clothes output, color and style. Based on human intuition, style is a more subjective attribute, which is based mainly on temperature. We can hardly see anyone wearing a down jacket in a hot summer afternoon, or see anyone wearing a t-shirt in a cold winter. So the algorithm utilizes temperature to determine the style of the clothes, based on common sense.
As far as the color choice, it's more of a objective opinion. So we want to use the machine learning to make the decision. For the machine learning training samples, we found couple hundreds of fashion examples of top and bottom combinations. We extracts the RGB value of the items and make those a combination. We also randomly generated some noise to represent bad choices of colors.
For the machine learning platform, we tried to use the AWS machine learning, but their Android API has some internal bugs and constantly returns some 400 error. So we switched to Google Prediction API for the machine learning platform.
When the user wants to display the clothes choice, he can simply enter the display result activity.
In the display match page, the app will display current weather and temperature. The temperature is one attribute in the decision of color outputs. Once the user clicks the display match button, the app will display a top and a bottom choice in the two image views. If the user is not satisfied with the current choice, he can always click the button again to get another output. The above screen shots are three sample outputs on that day.
Matching algorithm
In our matching algorithm, two attributes are the key roles in determine the clothes output, color and style. Based on human intuition, style is a more subjective attribute, which is based mainly on temperature. We can hardly see anyone wearing a down jacket in a hot summer afternoon, or see anyone wearing a t-shirt in a cold winter. So the algorithm utilizes temperature to determine the style of the clothes, based on common sense.
As far as the color choice, it's more of a objective opinion. So we want to use the machine learning to make the decision. For the machine learning training samples, we found couple hundreds of fashion examples of top and bottom combinations. We extracts the RGB value of the items and make those a combination. We also randomly generated some noise to represent bad choices of colors.
For the machine learning platform, we tried to use the AWS machine learning, but their Android API has some internal bugs and constantly returns some 400 error. So we switched to Google Prediction API for the machine learning platform.
So whenever we input the top and bottom RGB values into the prediction model, it will output if it's a good color choice or not. And the APP will first find all matching styles for the temperature, then randomly combines top and bottom and takes their color information to the prediction API. If the color choice is good, then the APP displays the choice of top and bottom.
Here is the calling part in the app. It first retrieves all the style-matching items from the dynamoDB, then randomly selects the choice and pass that to the prediction API.
Here is the calling part of the prediction API