New projects, methods and processes
Visit often to see the latest projects, case studies and to learn more about the methods and processes used to create graphic design pieces, websites and illustrations.
Kathy Weinkle
Kathy Weinkle WordPress site
Designed by Jay Carskadden, site development by Carol Tompkins
My latest project was building a WordPress site for Kathy Weinkle, M.Ed., a local life coach. This site was designed by Jay Carskadden and reflects Kathy’s colorful and positive personality. Jay wrote about the design process for this site on her blog.
For Kathy’s site, Jay designed the main menu using images for the navigation buttons. While this is the first time I had built a navigation like this in a WordPress site, I knew we wanted to use a three-state rollover navigation with an “active”, “hover” and a “current” state. There are many ways to potentially achieve this effect and after doing some research the best solution involved writing php code that allowed the “current” state to remain in place when the page was selected.
This is the second site I have worked on with Jay and each time we learn more about creating WordPress sites. Our client, Kathy Weinkle is very happy with her new website and writes about it in her blog.
The Cave of Forgotten Dreams
Cave of Forgotten Dreams poster
Recently I saw a preview of a 3-D documentary film by Werner Herzog, the Cave of Forgotten Dreams. It’s an amazing and powerful film and I suggest seeing the film when it comes out in theaters.
In 1994, a French scientist, Jean-Marie Chauvet discovered the Chauvet caves. In these caves full of sparkling stalactites and remnants of animal bones, beautiful paintings of cave bears, lions, horses, rhinos, bison and mammoths were found on the walls. These breathtaking animals were painted with fluid lines, shadowing, and some images even capture the movement of the animals. Carbon dating shows that the paintings were done over a period of at least 5,000 years. The first of the paintings were created at least 32,000 years ago — the oldest cave art known to science.
Towards the end of the film, one of the main scientists says that although there is no way to know why these paintings were created, it is obvious that these artists were trying to communicate a message and to immortalize a memory.
Check out the official trailer here. For a detailed look at the paintings see IMDB.
CSS Image Sprites — Part 2
Adding CSS code to style image sprites
This is a continuation of my last post, CSS Image Sprites — Part 1. For my social media buttons, I used one image to create an “image sprite” which is used make links to Facebook, Twitter and LinkedIn.
In order for this one image sprite to create the effect of three separate social media links with “active” and “hover” states, CSS styling needs to be added for each button. In this example, my image sprite will be divided up into six equal sections, each representing the correct position for the various button states. These positions are broken into either “top” or “bottom” and then “left”, “center” or “right”. Exact positioning may also be used as well.
This is a simple example of using an image sprite to create three buttons with “active” and “hover” states. In the latest site I am working on, a similar technique was used on the navigation bar to create six main buttons that use a “active”, “hover” and “current” state. Using this technique to create website links will help the page load faster because it uses fewer images.