"I refuse to answer that question on the grounds that I don't know the answer"
— Douglas Adams
This article will highlight the Artwork of journal designing, the next article will feature Formatting and pure CSS design work.
The Art & Design of Journal Skinning
Sometimes, I come across such brilliant works of journal skinning, where instead of just putting art into a design, the artist made art out of the skin itself. When designing a journal skin, I like to think of the design itself as an aesthetic piece, where every link, heading and sidebar would be part of the composition.
In her gallery, the first item is a tutorial for repeatable textures in a journal skin, which is very clearly written and easy to understand. A must read!
Her journals divert from the typical header/footer layout by giving shape to the boundaries of the journal within the shapre of the images and borders. They are both creative and beautiful.
Her gallery is full of creative works where the images are layered and worked into the layout. Please pay special attention to fav.me/d30nl9s">Snuvi Journal Skin, where she was given one static image to work with. She cut out the birds, placed them where she wanted for the layout composition and made a background for the journal that would tile/stretch smoothly as the journal expands (see Solinni's journals snuvi.deviantart.com/journal/ ).
This is a perfect example of what I've been trying to figure out how to make a tutorial for. Using a single image and creating a journal layout out of it, rather than just a header or footer image, but creating a design. Look through Nesmaty's gallery for inspiration.
Daily Deviation Journal
CypherVisor's skins all exercise dynamic CSS and design. His work combines code and graphics to create functionality and aesthetic.
Also, he has a plethora of CSS resources for coding custom boxes, which can also be used for journals and coding any where on DeviantART. Definitely a prominant memeber of the CSS community to look to for design and coding inspiration.
Known as the CSS Fairy, ginkgografix is probably one of the most well known figureheads of the CSS community. Undoubtedly, whether you know it or not, you have likely come across her work or influence. She has a vast motherload of tutorials and resources which any aspiring CSS coder/designer should want to look into.
Besides that, her journal skins are gorgeous and beautifully coded. Yes, codes are beautiful... Her design elements have a myriad of layout configurations and graphical elements layered and interwoven.
A Stylish Journal Skin
Ikue's brilliant fav.me/d227vtu">Post-it Note Journal is an effective design which uses only the title and HEADER of the journal. It is simple and an innovative way to use DeviantART's journal in a creative design. A prime example of thinking out of the standard layout.
His gallery exhibits beautiful designs where the fonts and graphics mix superbly. All the sections of the journal skin are worked into the overall design. His work demonstrates strong design skills with a professional touch.
An Elegant Design
Have a look at fav.me/d49j0xp">A Day of Rest CSS which demonstrates a photo transformed into a part of design by taking the subject out of the photograph and into a photo style frame for the header. The live view displays some fine CSS elements such as hover effects, in particular, the credit. Which is a simple copyright "button", with the credit popping up on hover. This effect is achieved through hover and display, a simple yet effective technique.
Her journals all display a professional style and aesthetics. The journal is the artwork, as much as the journal displays the art. Whether you're designing for journals, blogs or a website layout, these are key techniques. Especially the tiny details like the credit button. It is the icing on the cake that gives the journal the wow factor. Sleek design with a side of wow.
GillianIvy's Student's Assignment eCSSercise
Students, you are to choose any journal by any of the above. Install it, test it and thoroughly critique it using the DeviantART critique feature. If it is not enabled or you are not a premium member, please leave a very detailed comment evaluating the use, functionality and design elements of the journal. If they do not request a critique, ask them first or choose another deviation. Once your critique has been accepted, turn it in to me on our class discussion thread.
Part II will feature CSS Coding as Design
eCSSercise is a group to help you learning or improving CSS skills. People from the community who are willing to help, offer their knowledge to be shared and their time to teach you how to deal with classes, properties and values.
"There's something that doesn't make sense. Let's go and poke it with a stick."
— the Eleventh Doctor