Category Archives: Design

Designing a Child-Themed Website

Recently I had the opportunity to design and build a website for Little Stars Preschool. As part of this effort, I was given free creative license to do as I pleased (a blessing and a curse).

A website for a Preschool you say, how hard could that be? Well, harder than I originally thought. The info to be shared was minimal and straightforward so the organization of content and pages was a breeze. The challenge for me on this one was establishing a design that immediately conveyed a preschool theme, yet kept in mind that the only site visitors would be adults. Internet searches of existing preschool websites provided me nothing for inspiration, and websites that target kids (typically Kindergarten or higher) are so over the top with animation and colors that they result in immediate migraine-inducing seizures for anyone under the age of 14.

My goal was to keep the design simple, clean, colorful, and representative of Little Stars. So, I created a primary color header image of the school itself, found a nice scripty handwritten font in Google Fonts for my header tags, purchased a great background image of colored handprints, and kept the body text in an expected and readable font. From there I put it all in a custom WordPress instance so that the content is easily manageable going forward and bam, project complete.

Check it out, http://littlestarsmillcreek.com

Little Stars Mill Creek Website

Screen Shot 2012-04-23 at 8.44.07 PM

So Many Redesigns, So Little Time

Yep, another site redesign for greggrichter.com.  In fact, it’s a double whammy as I also put this same design in place on my sister site, richterwebdesign.com (mildly different text content to make the search engine gods happy).

My initial guidelines were the usual (simple, clean, blah blah blah).  But when I started to define what that meant,.. it truly meant, no subtle background images, no random color blobs, no icons stating the number of Twitter followers, etc.  As I went through the site and comped it in Photoshop, I really went forward with careful consideration of each and every pixel and asked myself, ‘Does this word or line, or shadow serve a purpose?’.  If the answer was no, than it didn’t make the cut.  This was my method to stay true to a clean and simple design.

Further, I knew I wanted the site to be bright white and most of the elements to be in grayscale so that the portfolio section of the site is allowed to truly stand out.  I also knew that I somehow wanted to take 4 pages of content from the old site, put them all on 1 page and somehow have a cleaner, lighter site.  And I think I achieved it.

I also want to give props for a few items on the site that were either designed or developed by talented members of the web community:

  • The JavaScript Slideshow used for my Portfolio was developed by Nathan Searles.  (Note I did some tweaking to the CSS and loading gif file, but other than that, it is in it’s entirety.)
  • Also used in the Portfolio is a lightbox like JavaScript piece called, Colorbox, developed by Jack Moore.  (again, just some minor tweaks to the CSS to fit my liking).
  • The icon set used is called ‘inFocus_sidebar_social_media’ and can be found here
  • The font used for Chrome / Firefox / Safari and IE9 visitors is called ‘ASENINE’ and can be downloaded here

Once the site was finished, I created a custom WordPress theme for this blog using the 2010 theme as a starting framework and here I am.

Hope you like the simplicity as much as I do.

Gregg