Giter Site home page Giter Site logo

hue-project3's Introduction

mndf.ll

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).

[email protected] [email protected]

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.

hue-project3's People

Contributors

seancswanson avatar jaderosse avatar mskitty007 avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.