Recently in Web Page Design Category

Photograph to Color Palette

| | Comments (0)

One of the more interesting tricks of color theory is to generate a set of color swatches in Photoshop from a reasonably pleasing photo.

In this exercise, you open a photo in Photoshop (or whatever) and use the eyedropper to pick colors from different parts of the photo. Then you use the paint can to add color to adjacent rectangular areas in a new file. When you're done, you usually get a palette where the colors seem to all come together perfectly through the magic of Photoshop. You can then use these colors as backgrounds and text colors to coordinate with each other (and the photo). See for an example.

Well here's my dog on my living room sofa in a fairly overexposed photo (I still need photo classes), but yes I did get a reasonably decent palette out of it.


Palette of tans, teals, greens

I did figure out that

1. You should select different areas of one object to get several value options for each color.
2. I recommend focusing on whatever areas jump out at you.

Variations of Penn State Blue

| | Comments (0)

When you work on Penn State Web pages - you know you will have master shades of blue. You would think you would run out of variations, but not necessarily. Some interesting options I have messed around with

I'm not sure these are going to win any design contests, but I learned some lessons for the future.

Cyberplagiarism - I discovered dark teal with this one, and I notice it's popular on the Web as well. It works well with other colors and isn't as strong as royal blue. You'll notice that I Iike using different shades of the same color...a lot.

Using Cases in Teaching
- This has the traditional navy blue header, but this time I threw in reds and greens.

Gradebook in Excel
- this is a revamp of an older site, which originally had an entirely peach orange background. I liked the color as a marker of identity, but obviously I toned it down. I also kept the old plug graphic which was kind of cute.
Someone else had experimented with changing the color of the subtitle under the teal header, so I made mine orange and added a paler menu. I think this where I started to appreciate using colors from the opposites side of the spectrum more.

Teaching with Databases - Here I threw in dark cadet blue, mixed with the dark teal and shades of gray. I also had fun looking for a suitable number cruncher font. I believe it's Eurostyle which comes with the Mac.

Computing with Accents - the royal blue of the header makes it tricky to work with, but I did learn to change the whites to not-so-white to reduce glare. You'll see that I'm working with multiple shades here (I think I like the extra texture it gives) I also threw a border around the content of the page as a "cheap trick", but was told right away that it made the pages more readable.

Faculty Teaching Showcase - Tilted towards periwinkle. I mixed it up by using different fonts in the sub title and added a tool line to separate the powerful royal blue from the navy and reduce glare. Another designer added the gradient and texture in the title bars for more variation.