An auto-indexing photo site that assign relevant labels to images on upload. User-submitted images are automatically tagged and indexed by Google Cloud's Vision API.
- Front End
- React
- Redux
- react-router
- semantic-ui-react
- redux-thunk
- redux-form
- Chart.js
- Back End
- Rails
- Google Cloud Storage
- Google Cloud Vision
- Mini Magick
- JWT
- Base64 image encoding (front-end) and decoding (back-end)
- Automatic AI-based label assignment of images
- User authentication and cookie storage through JSON Web Tokens (JWT)
- Logs users in on page load if their localStorage has a valid token
- Automatic backup of every image via Google Cloud Storage
- Users can upload images from their computer or by entering a third-party URL
- Dynamic handling of image downloads allows for multiple file types
Auto-animating placeholder prompts users to enter a search term and background loops through an array of images every five seconds. See here and here for code.
Placeholder animation disables when search bar is clicked. Search returns all images than have been tagged with a specified keyword (e.g. clouds) and sorts them by their relevancy score.
Images can be uploaded by entering a third-party URL.
Or from a user's computer. Images are auto-tagged on upload in a matter of seconds. See here for back-end image controller (upload code is in the "create" action).
Search results are sorted by relevancy score. (e.g. searching for "clouds" displays images very likely to contain clouds at the top and those less likely to contain clouds toward the bottom)
Clicking an image displays all of its labels, sorted by relevancy score. In this example, "dog" appears toward the top with a score of 97% whereas "grass" appears toward the bottom with a score of 53%.
Labels can be view as bar charts or in a radar chart.
Clicking a label displays all other images that have been tagged with that keyword.
Clicking a username displays all images uploaded by that user.