Skip to content
Project 3 || Hue || Jade Rosse, Desiree Rainey
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
bin
client
config
middleware
models
public
routes
.DS_Store
.gitignore
Procfile
README.md
app.js
hue.png
hue_example.gif
package-lock.json
package.json

README.md

Hue

A color detection and analysis utility that allows users to calculate prominent colors from an uploaded image to craft color schemes that allow for cohesive website design. Sign up and start exploring color with HUE today!

Title Screen

Example

Instructions

  1. Create an account.
  2. Upload an Image.
  3. View analyzed colors.
  4. Explore the color picker.
  5. Calculate complimentary color schemes.
  6. ???
  7. Profit!!

Getting Started

To get started journaling with HUE you may please:

  1. Visit the Heroku site
  2. Fork and clone this repo, npm install dependencies, launch nodemon or other server.

Prerequisites

  1. A willingness to view colors as the missing psychological link between products and users.
  2. An image to detect.
  3. Curiosity to explore the color picker.
  4. (Have NODE.js installed if cloning).

seancswan@gmail.com sean-swan@hotmail.com

Built With

Wireframes + User Flow

![userflow] ![wireframes] demo

User Stories

As a user, I want to be able to create an account to use the color detection service. As a user, I want to be able to upload a photo, analyze the colors, and view color schemes based on those colors to develop a website with cohesive design practices.

Versioning

As of January 28, 2018 this app is in development whilst enrolled in General Assembly's WDI program and is initilized in this GitHub repo. NPM init files created, incorporated a MERN Auth Boilerplate. Began stubbing out user flow and routes.

As of January 29, 2018, our group crafted API calls through Axios to fire a backend request to Cloudinary... Determining which results to store to later pass to imagga detection API.

As of January 30, 2018, this app is now returning analyzed prominent colors from the uploaded image and on click will redirect the users to the color picker. Databases are also fleshed out to relate saved colors to a user. Big win!

As of January 31, 2018 organized the CSS files to allow for easier targeting of elements in the large collection of components. Rendering a larger color picker, styling nav and footer components, getting things pretty!

As of February 1, 2018 the app has a semi-working delete favorite color function. Fixed some layout bugs involving height of parent components. Created more states to keep track of data across components and pulled functions out to be refactored and passed as props.

As of February 2, 2018 the user can now use Facebook to upload an image! Clicking colors calculated from color schemes now redirect cursor on the color picker. User can see instantly the color they just favorited.

As of Feb 3, 2018 here lies the MVP in all of its glory. There are now tooltip descriptions of color scheme calculations.

As of February 4, 2018 the code is much cleaner and is constantly being maintained in it's current version by Jade Rosse, Desiree Rainey, and Sean Swanson.

If we had more time I would...

Fix the functionality for removing favorite colors.

Convert wireframes to digital file.

Post Trello flow.

Authors

Jade Rosse - principal developer, bug squasher.

Desiree Rainey - principal developer, bug squasher.

Sean Swanson - principal developer, bug squasher, goal setter.

Acknowledgments

  1. A hat tip to General Assembly Seattle's WDI-16 Instruction team for constant love and support during the program!
  2. Inspiration coming from the numerous gorgeous color pickers and palettes and libraries that have given me tools to become a better web developer!
  3. "You" for visiting this repo and being so lovely.
You can’t perform that action at this time.