nfischer / framily-tree

:beers: An interactive family tree for Theta Chi fraternity
https://nfischer.github.io/framily-tree/
MIT License
7 stars 11 forks source link

Make pledge class colors closer together #2

Closed nfischer closed 6 years ago

nfischer commented 7 years ago

It may be worth investigating if things look better if the pledge class colors 🎨 are closer together (or perhaps even making this distance adjustable).

Right now, two generations of pledge classes jump from blue to dark purple to magenta. This means that it only takes a few hops to get to yellow, though, which isn't very aesthetically appealing.

Here are some ideas:

  1. Make all pledge classes the same color, but with varying intensities (i.e. start at a dark blue and work toward a light blue)
    • This has the added benefit that the user could customize the color palette (blue, red, purple, green, etc.) to match Fraternity colors, while also getting the desired contrast
    • This has issues with color text (black vs. white)
  2. Start at something like a purple and gradually get lighter, then switching to light blue and moving toward a darker blue. This could snake over to dark green ➡️ light green ➡️ light yellow ➡️ dark yellow, etc.
    • This shouldn't be much harder to manage
    • I'm concerned about the contrast between things like light green and light yellow
  3. Do the same thing I'm doing now, but make the delta a bit smaller
    • Close pledge classes may be difficult to distinguish
    • Far apart pledge classes will be closer to the same color palette, but will still likely fall into the same issue

Whatever solution I go with should work well for ~20 generations (that's the current 14 generations, plus 2 more year's worth). It should also be more aesthetically appealing with the chosen background image (and sufficiently easy to switch palettes given a different background image).

If this works well for the pledge class colors, it should be trivial to switch this implementation to the family colors for an awesome effect.

nfischer commented 7 years ago

Also, consulting material design palettes might be a wise decision

nfischer commented 7 years ago

Here's a cool package for material design stuff: https://github.com/shuhei/material-colors