Archive for May, 2007

James / May 14, 2007

Pie Charts in Illustrator

Illustrator likes Pie

Pie Charts are the epitome of boring. Ughh. Figures again. To top off the boringness, it usually means joining Excel in a joyful number crunching, board room pleasing game.

It doesn't have to be as painful for us designers though. Our friend Illustrator can be a saviour when it comes to putting together a few pies for those presentations. Just follow a few simple steps, and you'll view pie charts in a whole new light!

Breakdown of time spent on web development

That's my completed pie chart, showing the breakdown of time we seem to end up spending on web development. Here's how to make it.

The Pie Chart Tool

First of all, let's open Illustrator and make a new document [always helps!]. Click on the pie chart tool in the tools palette, as shown above. By default, the column graph tool will be shown, so click and hold the icon down to show all of the graph tools, and select the pie chart tool.

Now draw a rectangle to show how large you want your pie chart to be. Alternatively, you can just click anywhere on the canvas and enter the dimensions you would like by hand. As soon as you have entered the dimensions you will be greeted by the data entry palette shown above. Now enter the figures you want to show in a row. If you would like a legend, enter your titles in the first row. Once you've put in all the information you want, hit the tick button and close the data entry palette.

Apply Some Colour

By default, Illustrator colours pie charts in grey scale. I suppose this is handy if you need to make photocopies for all of the other office slaves who might need to read it, but it's usually a good idea to bring some colour to your presentations whenever you can. By clicking on the Direct Selection tool from the tool palette (short cut: control or alt A), you can select each slice of the pie individually, and change it's colour by choosing from the colour palette.

Now that you've coloured your pie chart, you're pretty much done. However, if you want to really impress your colleagues, we can take it to the 3rd dimension.

Taking it to the 3rd dimension

To get yourself some 3d pie, just select your pie chart, and go to Effect > 3D > Extrude & Bevel... This will bring up the 3d palette as shown above. Choose Isometric Top from the drop down menu. You can move the cube around to get the angle you want, or manually enter the digits (Excel users will feel at home on that front). I found that the best balance between readability and looks went like this:

From top to bottom in the angle boxes: 45, 35, -30 degrees.

Extrude to about 20 or 30pt.

Keep surface as Plastic Shading.

It also helps and saves time if you check the Preview option, so you can see what the finished pie chart will look like without having to close and reopen the 3d Extrude & Bevel window hundreds of times. Once you have found the ideal angle and look, hit OK.

Apply Drop Shadow

To finish it off, and give your colleagues that even bigger desire to copy your presentation and design skills, add a subtle drop shadow. Shown here, the shadow has an X-offset of 0 and a Y-offset of 2. The shadow has a blur of 3.

Ta da! You're done. And because you have applied all of these effects without doing any expanding or flattening, you can still edit your data. Have a go yourself, you know you want to.

Oh, and I've included an Illustrator file just for you to play around with ;-)

Ai
Get the Adobe Illustrator CS2 File [1.7MB]

Comments (37) arrow

James / May 14, 2007

Switch Complete.

GoSquared has moved to (mt)

We made it. After 2 days and only about 3 hours sleep between us we have completed the migration from our old hosts to Media Temple. We actually managed to move the files over fairly quickly, but various other aspects took a while longer. For example, our domain names are still being redirected to our new servers as some of you read this [it takes around a day for the new DNS settings to be registered around the world]. We also had to get to grips with a whole new server and its software.

We were online for most of today, but we occasionally had some difficulties with permissions on the server which may have prevented users from accessing the site and Liquidicity properly. These issues have been completely resolved now and normal service has resumed.

There may just be a few little problems we haven't found yet, so don't get too mad if you can't view that page you wanted for a few hours. We need some time to rest!

All in all, we are more than happy with our new hosts and are already enjoying improved performance.

Thanks for your continued support!
The Go Squared team.

Comments (2) arrow

James / May 12, 2007

We are moving

Our New Hosts are Media Temple

The other day, as the majority of you will know, we reached the front page of Digg. This was both the best and worst day in our rather short history. We gained the largest number of visits we had ever had in one day. On the other hand, we received too many visits for our hosts to cope with, causing us to take be taken down to avoid crashing their servers.

We unfortunately were unable to serve over half of the requests we received on the same day as getting dugg, meaning a lot of people turned away. Lost viewers: lost customers. We were instantly onto our hosts as soon as we realised the site was suffering under the mass influx. We waited. Then we waited some more. And more. Zilch. No response from our hosts whatsoever.

Our site was down, and there was nothing we could do. NOTHING!

Today we are announcing that we will be migrating to Media Temple by the end of the week. With Media Temple we will be able to expand our site, and accommodate the needs of our users in times of unexpected high traffic surges.

We aim to make the switch with as little down-time as possible, but, if the worst comes to the worst you may not be able to access the site for short periods of time over the next few days.

We really appreciate all the comments and thanks you (our community) have shown. We endeavour to provide you with an increased level of service and bring you more of the content you like.

Thanks ;)

The Go Squared Team

What's hot: 77 Vector Buttons, CSS Help Sheet, 165 Vector Icons

Comments (4) arrow

James / May 8, 2007

77 Vector Buttons hot off the press.

77 Vector Buttons Preview

Can't be bothered with making buttons? Want some new ones to add to your collection? Need a little inspiration? We've put together a little set of 77 buttons that we hope will lend you a hand in your times of button making breakdown. There all here to download in Adobe Illustrator format, just like our icon set. Alternatively, if you're not a fan of Illustrator, you can get a JPEG or an SVG, just follow the link. We hope you like them!

Ai Get the Adobe Illustrator CS2 File [1.9MB]

Don't have Illustrator?

Get the jpeg here. [264KB]
Button Set Small Version

You might also like our Icons...


Comments (261) arrow

James / May 7, 2007

Coolest Computer Desk Ever

MILK Desk

Now it's not often one can get excited about a desk. But this one is an exception. MILK is a fantastic all in one design that is actually in production, by designer Soren Kjaer.

He says most of the facts are just dimensions. We beg to differ, with a desk that has adjustable height, enough space to conceal ALL of the wires that could possibly snake around your computer, and built in storage for all of your gadgetry. The desk even contains a little Square space for your goldfish cube to sit in!

Finished in a white high gloss lacquer, just email Soren himself to purchase.

Comments (2) arrow

Caspar / May 7, 2007

My Wii Tried to Kill my Xbox 360

Console War

The rivalry between the PS3, Xbox 360, and the Wii seems to have peaked.

It seems now though, it isn't just the users that are fighting to have their console crowned 'the king of the next-gens' but the actual consoles themselves.

Many people now know the dangers of playing on the Wii without the wrist-strap (myself included), but that did not stop me from deciding to play baseball without it on. This wasn't for any particular reason except from the reluctance of having to constantly take the wrist-strap on and off in order to share the controller around with other people eager to try it out.

The controller subsequently slipped out of my hand as i lashed for the ball to prevent a strike out. It did not hit the TV. It did not hit my girlfriend in the face. Instead it 'missiled' straight into the front of the Xbox.

And it seems like I'm not the only one that has experienced this enraging war between the consoles. The writer of this article witnessed another act of violence.

It seems this poor guy's Xbox was murdered by his PS3 when they had an all out war in his home entertainment cabinet. Looks like the PS3 is a hot piece of kit, just like the Xbox, but can withstand more than Microsoft's console without showing a deadly red ring of death.

Also see: Like Colour?

Comments (2) arrow

James / May 7, 2007

Nominated as One of the Top 5 Blogs of 2007.

Top 5 Blogs of 2007

Wow, we didn't expect this. Looks like our humble blog, liquidicity, has been nominated as one of five of the Top Blogs of the year by EverybodyGoTo. Scroll down to the "web design and development" category, and just click on the one that says Go Squared. Thanks ;)

Seriously, we really appreciate the support, and intend to keep bringing you helpful and entertaining content.

Here's to a successful second half of 2007!

Comments (1) arrow

James / May 7, 2007

Love Colour? Love These.

Colour Lovers

Colour*. One of those difficult subjects - especially if you're in design. Web pages, posters, magazines. You need to be good at choosing and using colours if you want to work in design. As you know. So we've put together our selection of the best sites on the web that are devoted to colour. We hope this will shine a little light on the subject for you.

COLOURlovers

One of our favourite sites on colour, with a growing number of users [or "lovers"] which can only bring more expertise to a community passionate about the topic. Users can submit and rate colour palettes, making it easier to choose a colour scheme that works. Advanced options like the trends in the use of colours in magazines and web sites, and a brilliant search means the site is gaining a strong reputation with professionals.

COLOURlovers

4096 Color Wheel

A very helpful little colour wheel that is amazingly easy to use: just hover over the whell, and 3 of the nearest colours to your cursor will be displayed, along with their hex codes and similar colours. Brilliant.

4096 Color Wheel

Color Scheme Generator

This tool is based on a colour wheel, which generates monochromatic, contrast, triad, tetrad, and analogic color schemes. Basically it is really good at helping to pick colour schemes that work together.

Color Scheme Generator

The Color Database

A very handy and strong colour picking tool that has stood the test of time with plenty of designers.

The Color Database

Daily Color Scheme

A handy new colour palette for every day of the week. Usually inspired by a respectable designer.

Daily Color Scheme

Kuler

This is from the big guys: Adobe. If they have a site for colour, it must be important. In fact, it is one of the best sites there is. Entirely made in Flash, the interface is absolutely fantastic. Try it. You won't be disappointed.

Kuler

Color Blender

A cool little tool that matches real life colours to their digital equivalents, and generates a palette of complimentary colours.

Color Blender

*Color or Colour, depending on where you live.

Comments (6) arrow

James / May 6, 2007

Roundup of the Best CS3 Replacement Icons.

CS3 Icons Love or Hate

You either love them or loathe them. Whichever side you take, I think all the designers out there who have worked hard to do some replacement sets deserve a mention. So, here's some of the best anti-Adobe Icons. Hope you like 'em.

StudioTwentyEight

These keep the same idea as the standard Adobe icons, but offer a glossy, rounded, aqua feel.

StudioTwentyEight CS3 Icons

Adam Betts

Adam's icons have taken the amazing packaging designs from Adobe and turned them into awesome app and document icons. I use these.

Adam Betts CS3 Icons

Louie Mantia

Louie's icons are a mix of CS2 and 3, with the Square, and rounded corners surrounding the familiar CS2 and Macromedia icons so many of us miss.

Louie Mantia CS 3 Icons

Nuclear Potato

As far as I know, not many people know who this designer is, but his icons are pretty decent.

Nuclear Potato CS3 Icons

Koregraphik

These icons also follow the new CS3 design, but have rounded corners and larger Text to make them clearer.

Koregraphik CS3 Icons

Jonas Rask

OK, these are a mix of CS2 and CS3, but they are quite cool none the less.

Jonas Rask CS2 and CS3 Icons

Jeremie Cornelissen

Jeremie's icons offer another mix of new and old, with monotone CS2 emblems subtly glowing though the new colours and shapes of the CS3 set.

Jeremie Cornelissen CS3 Icons

Comments (2) arrow

James / May 3, 2007

165 Lovely Vector Icons (for free)

liquidicity Icon Set Preview Here you go, the icon set by liquidicity. 165 hand drawn icons that you can use for whatever you like. Most probably your website. We have worked pretty hard to get these done, so we hope you like them.

Ai Get the Adobe Illustrator CS2 File [1.9MB]

Don't have Illustrator?
Get the SVG here. [471KB]
Get the jpeg here. [256KB]

Oh, and here's a little preview:

Liquidicity Icon Set Smaller

Now available in 5 Colours!

See also: HTML Help Sheet

Comments (87) arrow