Nick Roach, the man behind Elegant Themes has released a stunning new professional gallery-style theme that makes handling your own online portfolio a breeze.
I have used Nick’s themes for some time now and have found the annual subscription cost of $19.95 USD, which gives you access to all his themes, to be excellent value for money. In fact, it’s an absolute bargain!
This latest theme named “Lumin” features 3 colour schemes, a blog style option, gallery layout display, automated thumbnail resizing, ad management, and more.
The graphic details in this theme are stunning. The subtle background texture and the clever use of Java script combine to deliver a clean and truly elegant theme.
Every visual element in the site has been carefully crafted using subtle textures and shading as seen in the sidebar and comments areas below.
Nick’s intro at Elegant Themes says, “I craft my themes with a goal of simplicity and professionalism and strive to inject each design with a dose of modest elegance. I believe that your website is not just a tool, it is an integral part of your identity. My job is to respect each customer by providing attractive and userfriendly templates that will help you achieve your online goals.”
With the release of Lumin we believe Nick has succeeded again.
I’ve been using WordPress for a few years now and am always on the lookout for high quality themes. I have purchased quite a few themes over the years and have for the most part received great value for money. However, when you come across high quality themes for FREE it feels like you have discovered hidden treasure! While reading a recent post on Twitter I discovered 4 outstanding themes from WPVulpe. So here they are…….enjoy.
If you have been exploring the online world of design, chances are you have heard of Chris Spooner or at least Spoon Graphics. I’m not exactly sure when I first discovered Chris’ work, I think I may have stumbled across one of his tutorials after watching an episode of Photoshop User TV. Since then I have been following Chris’ work and in particular his blogs. Chris’ approach to design is fresh and unique and even though he dislikes cheese he is a formidable talent. Given that Chris is an outstanding designer and well respected in the online design community, when it came to choosing who would be the first designer to approach for an interview on Red Bilby, the choice was easy………Chris generously agreed and here is the result:
How long have you been a freelancer?
I decided to head out on my own in September 2008, so it’s just over a year ago. I’ve loved every moment!
Where is your studio located?
As a self employed designer I work from my home-office in Sheffield. Or to be more exact, it’s the first door on the left at the top of the stairs.
What equipment do you use?
I use a 15″ MacBook Pro, coupled with the Apple 24″ LED display. I find this setup awesome, as it gives me the best of both worlds – I have a laptop that I can carry around with me for max portability, but also a large screen and desktop setup in my office. The best feature of the LED screen is the built-in magsafe charger. It’s fab to be able to quickly connect the screen and charge the laptop without any extra cables.
Otherwise, I use a Wacom Bamboo tablet and mouse, which is only an entry level model, but has been a great introduction to the world of pen tablets. Now I’ve had a taste of the basic model I’d love to step up to the Intuos3 model.
Are you PC or Mac?
I’m a Mac. I’ve been slowly building my collection of Apple products since switching from Windows and have never looked back!
What software do you use the most?
It’s probably safe to say Firefox is open for the majority of the time on my computer, although design wise Photoshop is probably where I spent the most time.
What advice would you give someone starting out as a freelancer?
I’ve found being active in the community through blogging and networking online has been a huge boost to my career. I always advise new designers or those looking to gain more exposure to setup a blog and begin documenting the things that inspire them, or to write tutorials and articles that help others out. The results can be amazing.
What challenges have you had to overcome?
There’s always lots of little challenges we face on every project. Sometimes they’re coding solutions we need to find ways around or techniques in a particular application that require some thought to produce the desired effect.
Who inspires you?
I find plenty of inspiration online from all kinds of designers. I don’t tend to name any one person as I’m always inspired when I pull up my RSS feed reader and begin browsing some new content. I’m forever picking up new tips and ideas from everyone in the design community.
What is the most difficult thing you have to deal with as a designer?
One of the most frustrating things I deal with as a designer is client work. However client work is also one of the best things about being a designer, so it’s definitely a love/hate relationship. Sometimes there’s nothing worse then putting lots of hard work into a design, being really happy with it and expecting the client to feel the same way, only to receive negative feedback.
How do you quote on jobs and set pricing for your work?
I usually gather information on the project then estimate a sensible number of hours, or morning/afternoon work sessions that would be required to complete the job. This is then multiplied by my personal hourly rate and presented as an overall estimate.
How do you get work?
The majority of my work leads come through my blog, or from friends I’ve made in the design community.
How important has blogging been to your career?
If I hadn’t established my blog, I wouldn’t have had any of the opportunities I’ve seen over the past two and a half years. Setting up a blog has been the best decision of my life, seriously! It’s what enabled me to work for myself, has given me the freedom of choice on design projects and has helped develop my personal skillset and knowledge.
What hours do you work?
I typically work during the day from 9 (sometimes 9:30!) until around 6 in the evening, although a lot of this time is probably spent doing things that wouldn’t be classed as work by most! Browsing the Internet and checking out design links I’ve decided is highly important work, that I must make time for!
What work/project/job are you most proud of?
I always list my SpoonGraphics blog as the project I’m most proud of, as I’m amazed at what it has grown to. Client project wise two of my favourite jobs are the DesignBump redesign and the Vivid Ways logo.
What type of work forms the major part of your income?
Website design work probably forms the largest portion of my income, but being generally larger jobs the time is often split over a couple of months.
With research in the UK revealing consumers believe banks have spent too much time on the back-end of their websites and not enough time on the parts people actually use. In view of the fact that Australian bank websites, unlike their UK counterparts, have performed well in customer satisfaction surveys, we decided to take a look at the current state of Australian bank websites and see how they stack up.
Setting the Standard
ANZ in our opinion has been leading the field in the online arena for some time. ANZ recently launching their new global brand which set the tone for their website. Their media release clearly spells out their mission:
“ANZ today launched its new brand identity and positioning to support its super regional strategy and set an aspiration to develop ANZ as a people-focused, uncomplicated bank.“
We believe the redesigned website does a pretty good job of communicating those values.
The placement of the main call to action buttons – Log on / Register – in the prominent top right of the screen and using colours to draw the eye, are in line with “best practice”.
Once you click the “Log on” button you are presented with a very clean, functional pop-up. All links and options you may need at this stage of the process are right there where you would expect them to be, including information about current security warnings.
Leading the Field
The ANZ has been setting the standard for Australian banks, often being the first to adopt new technology. In July, ANZ was the first bank to release a specially designed webpage to coincide with launch of the Apple iPhone mobile device. iPhone customers could view their account balance and recent transaction history using a purpose built version of Internet Banking. They backed this up with a media campaign including a TVC. Watch it below.
For all the reasons above the ANZ website is our choice as the No.1 Australian online bank.
Coming in at No.2 is the Westpac website. It features a very clean corporate layout with simple tabbed navigation. The content has been divided between five tabs which keeps the navigation from becoming cluttered. The “sign in” (logon) button is placed in a similar position to the ANZ site (top right). The main difference is the functionality. Clicking the “sign in” button displays a dropdown with links to seven different areas of the site.
Clicking through to the ‘Westpac Online Banking’ link brings you to the main sign-in screen. The layout is clean and simple and uses a keyboard style layout to present the log in buttons. Like the ANZ site, the Westpac site has endeavored make the whole process of online banking simple and easy to use.
Our No.3 may have been the Commonwealth bank, however they are about to launch a new site so we will reserve our thoughts on that site until it is launched. Our choice for No.3 is ING Direct. Even though it is still a serious corporate site it endeavors to inject the cheeky personality associated with their brand largely due to their choice of Billy Connolly as the face of ING globally.
The “login” button follows the convention of all the other sites positioning it on the top right of the screen. The secure login screen that follows uses a keypad that employs changing the position of the buttons on each refresh of the page as a security measure.
The freshness of the site is largely achieved through the use of colour. Orange evokes warmth, it’s comforting, spontaneous and welcoming. Additional elements – vector style icons and hand drawn icons – add to the fresh, vibrant, fun feel that is so much a part of the brand. The overall effect works very well. “Well done”, to the design team. They have created a site that manages to combine the security and trust necessary for a banking site, with a warmth, casual appeal, and personality rarely seen in this space.
Author
Michael Chanter
Michael is a freelance designer and Creative Director of Red Bilby – a boutique design studio in Melbourne, Australia.
Grunge artwork has become very popular of late and you can never have enough grungy images in your toolbox.
Here are a series of metal textures in various states of decay for you to use in your projects.
As part of a series of tutorials that will follow the development of the Red Bilby brand, this tutorial walks you through the creation of a vector character logo using Adobe Illustrator and Photoshop CS4.
Author: Michael Chanter
Michael is a freelance designer and Creative Director of Red Bilby – a boutique design studio in Melbourne, Australia.
Final Character Design
Tools Used:
Pencil & paper
iMac 20″ Intel
Adobe Illustrator CS4
Adobe Photoshop CS4
Step 1.
In this example I had decided on the company name (Red Bilby) before I began creating the character so the starting point for the design was a Google image search for ‘bilbies’. Remember, images found through Google images are mostly copyright protected so they should only be used as a point of reference.
The starting point for character design is always doodling on paper with a pen pencil or anything else that can make a mark. So draw, draw ,draw!
TIP: You never now when you will get an idea so if you carry a small sketch book with you where ever you go you’ll be able to record that flash of inspiration.
Step 2.
After you narrow down your roughs to something approaching the design you envisioned, continue to refine the design trying different variations and noting improvements for the next round of roughs.
Step 3.
Once you are happy with the pencil sketch it’s time to fire up the Mac. Scan the pencil drawing and save it. Open Adobe Illustrator and setup a new artboard. It’s best to create a logo for print, that way you will have a hi-res vector image that can be resized to suit other formats. I’m in Australia so I always setup a file as A4.
Step 4.
Open the Layers palette and rename the default layer “sketch”. Place the scan of the pencil drawing on this layer. This will serve as a guide for the illustration. Set the opacity of the scan to 20% and lock the layer. Create a new layer above this layer and call it “head”.
Step 5.
Using the pen tool draw the head shape. Once you have drawn the shape fill it with a colour. TIP: Set the fill colour to “none” and set the stroke colour to something that will be easy to see over the scanned drawing. Red works well.
If you don’t do this the fill colour will obscure the scan making it difficult to see where to add the next line node.
Step 6.
Create a new layer for the snout and continue drawing with the pen tool.
TIP:Creating separate layers for your character elements means you can easily export them to flash if you need to animate the character in the future.
Step 7.
Continue creating new layers and drawing the elements for each part of the character. You will end up with a layers palette like the one below.
Step 8. Create the detailed areas.
To create the eye ball draw a circle using the “Elipse tool”. We will add finished colour as we go, as this helps to get the look right from the beginning. Create a new gradient swatch that fades from a vivid blue to very pale blue and save it to the swatches palette.
Step 9.
Select the “Star” tool and set it to create an 18 point star with the radius dimensions shown below. Draw a star and fill it with a medium blue.
Step 10.
Draw another circle with the “Elipse” tool and fill it with black. Draw a small white circle and move it to the top left of the black circle. This creates the shine on the eyeball. Now combine all the four eye elements together and group them.
Step 11.
Draw another circle with the “Elipse” tool and position it on the head element. Hold down the “shift” key and select the circle and the head. From the “Pathfinder” palette click “Minus Front”. This cuts out a hole in the head of the character. Draw another circle and use the same technique to cut out the eyelid element – seen in black below.
Step 12.
Move the eyeball into position behind the cutout in the head you just created. You can move the eyeball around to see what looks best. Again, having separate elements like this is really useful if the character is going to be animated in Flash or Toon Boom Studio.
Step 13.
Now it’s time to get the colour right. Setup the colours you will use for the body in the swatch palette.
Step 14.
Use the “Gradient Tool” to fill the various body elements of the character. Pay attention to how light would fall on the surfaces and adjust the direction of the fills to give the shapes dimension.
Step 15.
Add the finishing touches – spots and shine on the snout, gradient fill to the inside of the ears and a darker coloured piece to the tip of tail. Finally add the pencil between the ears and we’re nearly done.
Step 16.
The final touch is to add some shadows under the leg, below the pencil and on the floor under the character. For this I use Photoshop CS4. Open the .ai file in Photoshop. It will open on a transparent background. Hold down the “command” key and create a new layer under the .ai layer and fill it with white. Create another layer above this and call it “shadow”. Draw a flat ellipse with the “Ellipse Selection” tool and fill it with black.
Step 17.
Deselect the ellipse and apply a 6 pixel Gaussian Blur to thee black ellipse. Now the part I love. Apply a motion blur to the black ellipse. See the settings below. This gives the shadow a nice subtle fade on both edges and makes for a much more convincing shadow. Reduce the opacity to around 15%. All that’s left to do is select the end on the pencil.
Step 18.
Use the pencil tool to select the end of the pencil and part of the body. Use a soft brush tool with the settings below and paint a shadow on a new layer. Adjust the opacity if it looks too dark. Do the same with the front leg and that’s it! We are done!
Step 19.
Export the file as a psd or png if you are going to use it for the web and save a hi-res psd for use in print. In the next post we will walk you through creating a Style Guide in Adobe InDesign CS4.
The Red Bilby Design Blog will be opening soon. What should you expect from the blog? Here’s what we are planning. Articles on all aspects of design including, print, web, video and pretty much anything else that’s design related. As well as that, we will be offering free resources and downloads for use in your design projects. Interviews with leading designers, photographers and illustrators will give you a unique insight into their techniques, motivation and tricks of the trade. Our mission is simple – we are determined to make this blog one of the best design blogs on the net.