CSE 615 Design

Jonan DonaldsonGoalConvince adult English language learners to make full use of Web 2.0 tools in the Wells website.

AudienceAdult English language learners such as the ESL population in a community college.

MessageYou can use the fun and free interactive multimedia tools on the Wells website to help you learn English in your own time at your own pace.

First Try

In Photoshop I combined a picture of a surfer with a picture of a keyboard to embody the message and wrote a title (the title of my website for English Language Learners), a subtitle, and some text.

Repetition

I changed the title, subtitle, and heading font to Broadway because it is easy to recognize, therefore accentuating repetition. I also added a dark red bar under the title and headings to both tie them together (what gives you this freedom) and add to the repetition. I thought it looks a little more professional, but somehow the effect seems cold.

Contrast

I made the title as big as possible. To make it stand out, I put a dark red background behind it and changed the color to white. Then I did the same with the subtitle to add a bit of repetition and balance out the upper and lower parts. I kept the contrast of the headings and text block font size, but rearranged them in a diagonal line moving in line with the surfer. The effect of the contrasting dark red background to the title and subtitle is quite strong. It makes it look more important. However, I don’t like the fact that it takes away from the openness and freedom of the design. It seems to be caging the surfer in a bit.

Monochrome

I made a monochrome scale that is almost grayscale but with a hint of red. I also lightened up the hue. Because the overall effect is classy, I used Papyrus font and made the text blocks much smaller and a lighter hue to open up lots of space. Although I like the classy effect, I think it doesn’t match the content (it’s free, fun, and exciting).

Type

Typography Contrast 3 – Form, Structure, and Size: For this design I tried to take the size contrast to an extreme by making the title as big as would comfortably fit on the page in a heavy block serif (Blackoak) contrasting with a thin sans serif (Helvetica) subtitle. The structures contrast well with the size contrasts. I continued using the sans serif Helvetica for the headings and text blocks for consistency, but contrasted form by using a regular type for the headings and an italics type for the text blocks. This design is fairly comfortable, and it makes the title stand out.

Final DesignI liked the fun feeling brought out by the complimentary color scheme, so I thought I would push “fun” some more. I heightened the vibrancy and saturation of the background colors. Then I changed the title and subtitle to orange (complimentary to the blue ocean and sky) and chose a fun font, Curlz. However, the subtitle and title clashed when using the fun font for both unless I brought them as close as possible together (proximity), and there was a perfect space for the subtitle right on top of the title. I tried the Curlz font for the text block, but it was too confusing and wasn’t fun anymore, so I chose Palatino Linotype (an easy-to-read oldstyle). I pushed contrast by enlarging the headings in comparison to the text blocks. I also contrasted the size of the title and subtitle. I aligned the text blocks with the direction of the wave and surfer. I aligned the title with the second text block. I added orange lines under each heading to use repetition to tie in with the title. I like the overall effect. I think it succeeded in being fun!

Attribution: The two original creative commons images

'Keyboard‘: http://www.flickr.com/photos/71753457@N00/204145200

'city and surf' http://www.flickr.com/photos/73584213@N00/219728424