Food Vectors

Friday, October 23rd, 2009

DOWNLOAD THE .AI FILE

DOWNLOAD THE .EPS FILE

These food vectors can be used, free and without restrain, in many different web design, illustration, graphic design and user interface design projects! In this free vector pack of food objects you will find a variety of 30 culinary delights including cupcake vector, pickle vector, pizza vector, tamale vector, corn kernel vector, toast vector, oyster vector, watermelon vector, hamburger vector, pork chop vector, pea vector, jalapeno vector, corn dog vector, pancake vector, lobster vector, hot dog vector, egg vector, grape vector, chicken drumstick vector, pie vector, cake vector, pepper vector, strawberry vector, meatball vector, ice cream vector, ravioli vector, pretzel vector, shrimp vector, bacon vector, sausage vector.

If you’re looking for some free food vectors then you’ve come to the right place! I’ve used these vectors in a few projects for web design and graphic design and was so pleased with the results that I decided to share them with the world. These food vectors are completely free, the only stipulation I make is that if you distribute them then you must have a link back to this article. with that said you are, of course, encouraged to share these free vectors on your blog, website or twitter feed.

preview of the Food Vectors
preview of the Food Vectors

preview of the Food Vectors

I hope you enjoy these and have good use for them, thanks!

right click to download this tileable pattern:

a Tilable pattern using the food vectors
a Tilable pattern using the food vectors

a Tilable pattern using the food vectors

5 Essential Freelance Web Design Business Tips I’ve Learned in My First Year

Thursday, October 15th, 2009

It’s now been a little over a year since I graduated from university and started working as a freelance web designer – and what a bumpy ride it’s been! Aside from the roller coaster of not having work, having too much (and then not having enough again), worrying about living without health insurance, and a generally unhealthy dose of stress, I’m just now starting to get the hang of things. I’ve compiled a list of 5 essential business tips that have allowed me to finally get a grasp on my business.

1. Business before design

While a new project is always exciting, get in the habit of first making sure that all parties are clear on the business agreements. There is plenty written on the subject, but write up a contract, add some stipulations to your estimates, and make sure you go over these with your clients. Trying to sneak by late fees and other fine print foolery is best left to credit card companies. With that said, be sure you have a late fee – you don’t want to be spending half your days chasing down checks. Aside from a late fee, I insist on 50 percent up front – a limit to revisions before the hourly rate kicks in and that all work can be used for self promotion.

2. Don’t work for friends and family

I love my friends and family – and that is the exact reason that I refuse to complete any work for them. Business sours easily, deadlines quickly add tension to an arrangement, and the last thing you need is a ruined personal relationship because of a work disagreement. At the same time they are your friends and family! You want to help them out, right? Make an arrangement with another designer you know – they will give your friends and family a generous discount on design work and you will do the same for theirs. This is my win/win situation.

3. If you have a design/art name you work under, get it registered

Sending back a check because an employer writes it to your moniker is going to drive you crazy. I had to send one of my first checks back to Australia and didn’t see the money for almost 5 months after the job’s completion – a lesson I learned the hard way. Registering a business name is quick, painless and cheap. It cost me $38 to register Chapolito, get it printed in the paper for four weeks (required to make it official) and open a business account with my bank – and it’s good for 5 years. In addition to all of this, you’ll never be more proud than when you’re holding the official paper declaring you a business owner!

4. Don’t worry so much about the money

I often find myself worrying about finances and how to pay the bills, but I’ve never had a problem. I’ve come to realize that if you’re busy and passionate about what you’re doing, the money will come. Like always, make educated decisions with your money and live within your means; but as long as you’re busy working, studying and building your company, there will be new opportunities. I still spend between five to 25 percent of my day finding new clients and jobs, but I’ve learned to not worry about slow periods — they give me the chance to work on my portfolio and personal work, which in turn pays off by improving the worth of my design skills.

5. Keep all your receipts

When it comes time for taxes, you’ll be glad that you’re self employed! Although no one likes filing their taxes, the amount of deductibles you’ll have at the end of the year will make the experience a much more positive one. There are many things that can help you pay less income tax: working at home, owning a car that you use for business — or perhaps any hardware, software or design books you’ve purchased!

While I certainly have learned a lot over the last year, there’s always an innumerable amount more to soak in! I’m looking forward to my second year working in freelance web design and I invite you to share any tips and principles you’ve learned as a freelancer.

Logo Design Case Study: Crooked Crooks Logo

Thursday, October 15th, 2009

Examining the logo design process of creating the Crooked Crooks Logo

Crooked Crooks is a young clothing label that approached me in 2007 to help them brand and produce a logo design for their label. Based in Tempe, Arizona, Crooked Crooks aimed to be a combination of Hip-Hop street wear, some illustration, and a general sense of “the suburban thug life.” The challenge was to successfully combine these elements to create a unique look and feel for the brand without letting any one concept dominate. On top of these stylistic requirements, the logo required a limited palette so that it could be screen printed on t-shirts and other merchandise inexpensively and with ease.

The client was interested in using pirates as a stand in for the “thugness” he hoped the brand would portray. We discussed a number of possible t-shirt designs that would make up the first line, and with a continued trend of pirates (thugs), looting (crime) and treasure (bling), it seemed fitting that the label hinted of these in some form.

Brainstorming

Initially, I wanted to bring in a real hip-hop icon – something a pirate could relate to and a good representation of thug success: diamonds. I sat down with images of diamonds, money, and bling on the mind to draw some sketches and quickly brought to life my creations via computer.

A few of the initial sketches, not exactly what we were looking for.
A few of the initial sketches, not exactly what we were looking for.

A number of early renderings with the parrot in the logo.

This first batch of sketches didn’t really convey enough about the company’s style and message. The client really liked the type treatment with the middle logo above, but the money bag wasn’t quite right for his vision; while it did contain the pirate and money elements, it lacked the punch need to make it iconic and memorable.

At this point, the client expressed his interest in trying the logo with an animal mascot. It didn’t take a lot of brainstorming to realize the parrot was an excellent match for the brand.

Production

The parrot idea was instantly settled upon and variations were underway. Abundant details of the design were discussed and agreed upon throughout the production, such as colors, composition and details of the parrot illustration.

A number of early renderings with the parrot in the logo.
A number of early renderings with the parrot in the logo.

A number of early renderings with the parrot in the logo.

While everyone was happy with the parrot and the logo, it was still missing the money connection that was such an integral part of the brand. I eventually came up with the idea to put a gold coin in his mouth; this allowed the logo to have some of the great imagery that the money bags had, but still keep the more illustrative parrot.

Final Touches

A couple more tweaks and we had the final logo! After completion of the logo and a number of periphery items like the tags and labels, I was asked to illustrate some of the t-shirts. In total, six of my designs have been printed and sold.

The final logo design.
The final logo design.

The final logo design.

Web Interface Tutorial Posted at PSDTUTS+

Monday, October 12th, 2009

PSDTUTS+ posted How to Elevate Your Website Design Process and Results, a web interface tutorial that I wrote for them about web interface design. This web interface tutorial focuses on creating a business web interface design with a fun side; some of the ideas and patterns explained include the 960 grid system, consistency within your designs, the hierarchy of elements, Photoshop keywords and websafe fonts.

full view of the mock up created for the web interface tutorial
full view of the mock up created for the web interface tutorial

full view of the mock up created for the web interface tutorial

For example, consistency is a reoccurring theme through out the web interface tutorial. From small things (such as making sure the radius of corners is always the same) to more obvious concerns (like that all buttons are set in the same type), consistency is a practice I heavily emphasize. If the readers of the tutorial can understand the importance of consistency and how useful it is in aiding the scanability and usability of a website, they will walk away with a more enlightened view of web interface design.

Detail view of the PSD Tuts plus mockup created for the web interface tutorial
Detail view of the PSD Tuts plus mockup created for the web interface tutorial

Detail view of the PSD Tuts plus mockup created for the web interface tutorial

PSDTUTs approached me to write this web interface tutorial because they admired my work and felt I could help other web designers achieve the same level of success in their designs. Since it was my first web interface tutorial, I was quite overwhelmed with the difficulty of not only gathering the images, but actually writing the tutorial itself. While at times I venture off topic here and there, I feel the final product was a great in-depth look at the web design process, best practices, patterns and tricks.

Below you can read the overview:

This tutorial will guide you through the process and ideas behind the designing a professional website with a funky flair in Photoshop. The tutorial will read much like a “choose your own adventure” novel in the hopes it will encourage creativity and uniqueness in your design with a little advice and instruction along the way. Adventure time!

If you have any questions for my after reading this web interface tutorial, please do not hesitate to email me at info@chapolito.com.

Awesome Camera Vector Illustrations

Monday, October 12th, 2009

DOWNLOAD THE .AI FILE

DOWNLOAD THE .EPS FILE

These awesome camera vector illustrations are free to download. Inside the vector file you will find camera illustrations in vector format. These cameras include a slr camera vector, twin lens reflex camera vector and a holga camera vector. In addition to the camera illustrations I’ve include an extra mystery vector illustration that I think you will enjoy. You can view a preview of the camera vectors in the image below:

Camera Vector Preview of Camera Illustrations
Camera Vector Preview of Camera Illustrations

Camera Vector Preview of Camera Illustrations

These vector illustrations are offered free, without limitations for use in your personal, commercial and metaphysical works. Please feel free to review and link to these vectors, but you are prohibited from hosting and distributing them yourself. A link back to http://chapolito.com would be appreciated!

If you enjoy cameras and photography like me then you’ll be sure to find a use for these camera illustrations in your promotional and private work. The slr camera vector and the holga camera vector are based off of my own cameras, but I do not own a TLR camera–at least not yet!

San Diego Web Design

Monday, October 12th, 2009

There are a lot of San Diego web design companies, from small studios that focus on local San Diego service provider web sites (which I like to refer to as business card websites) to agencies with offices around the country that work on huge web campaigns for multinational corporations. My company, Chapolito, is still a small San Diego website design studio, compared to a lot of the bigger agencies, but I have still had the opportunity to work with a number of large corporations. One of the common misconceptions of the web design industry is that large corporations need to work exclusively with big agencies to complete their projects. The reality is though, that often projects are broken down to small chunks, are completed by a network of collaborating web designers, and operate independently of, but under, the whole working model of the company.

Gone are the days of Mad Men when you can grab the entire advertising accounts of huge corporations and the work is all done in one office. While the shift to distributed workloads are nothing new, I find the mindset often sticks, and it sticks not so much in those that have the large web design accounts, but in the small companies that can play an integral part in shaping and producing the work.

I have been told numerous times that I need to appear like a large San Diego web design company to land large clients and big deals with local corporations. I would argue that the reality is that it has more to do with your proven portfolio and your ability to meet deadlines than the size of your staff. I’m not saying that there aren’t plenty of projects that I simply couldn’t handle by myself, there are, but collaboration has allowed me to take these projects on regardless and complete them to optimum client satisfaction. In regards to landing jobs, there are still some San Diego corporations that don’t understand fully the power of collaboration within the San Diego website design community, but there are many more that do than small studios that think they are adequate to receive these accounts.

What I am not saying here is “give the little guys a chance,” many of my clients already have and keep coming back for more web design work. What I’m trying to relate is that, other San Diego web design studios should not feel that just because we are small that we can’t handle larger projects. There is no shame in bringing in a whole team of freelancers to complete a huge online campaign. This is the future of the way we have been and will be working.

Free Bottle Vector, Fireworks Vector & Party Vector Graphics

Monday, October 12th, 2009

DOWNLOAD THE .AI FILE

DOWNLOAD THE .EPS FILE

Who doesn’t love celebrating and having a party? Now you have the vector illustrations to accompany any party graphics and material! These high quality Fireworks vector, bottle vector, cake vector and more are sure to get you in the fiesta mood! You can view a preview of these vectors below:

Free Bottle Vector, Fireworks Vector and Cake Vector are just a few of the awesome vectors in this free pack
Free Bottle Vector, Fireworks Vector and Cake Vector are just a few of the awesome vectors in this free pack

Free Bottle Vector, Fireworks Vector and Cake Vector are just a few of the awesome vectors in this free pack

These vectors are offered free and without limitations for use in your personal, commercial and metaphysical works. Please feel free to review and link to these vectors, but you are prohibited from hosting and distributing them yourself. A link back to http://chapolito.com would be appreciated!

In the party vector pack you will find a number of bottle vector graphics, including a wine bottle vector, beer bottle vector and numerous party themed vectors that are associated with bottles such as champagne cork vector, martini olive vector, red beer cup vector, and a lime slice vector.

For the smokers, there are a cigar vector and cigarette vector, although I must admit I find both of these repulsive! Regardless, cigars are often a celebratory indulgence to many people in a party and celebrating mood.

For those culturally inclined, I have included my favorite: a donkey piñata vector. He’s so colorful and fun! I never had a party as a child without a piñata — in fact, I still don’t , and it’s always the highlight of the party. Of course that is also why I have included the cake vector – because no party is complete without a birthday cake. Celebrate a birthday with a birthday cake vector and do it with style!

When it comes to giant celebrations (such as an independence day), you can now celebrate with a real ‘BANG!’ with a fireworks vector. The illustration of the fireworks vector is sure to excite your friends and guests.

Additionally there is a Mardi Gras mask vector, beer keg vector, top hat vector, cool shades vector, and illegal pills vectors (for those of you who like to push your luck). I hope you can make good use of these vectors!

Free Template Layout of a Corporate Web Design

Monday, October 12th, 2009

DOWNLOAD THE .PSD FILE

Solely for practice, I fully designed a template layout in Photoshop for the fictitious company “Elevator Tools,” and am offering the web PSD template for free. The design is intended for a corporate web site, but with a few tweaks I’m sure you could turn it into a number of different web sites.

You can view a preview the free template layout in the image below:

full view of the corporate web design
full view of the corporate web design

full view of the corporate web design

I think many of the people downloading this PSD file are designers looking to learn from the layout or incorporate parts of it into their designs, and I encourage both! This web PSD template is offered free and without limitations for use in your personal, commercial, and metaphysical works.

Once you download and open the layout in Photoshop, you will see that all the layers are clearly organized and labeled. You should have no problem navigating the PSD file and I hope you will — if you don’t already — start employing some of the organizational methods used. If your PSD will ever make it into the hands of fellow web designers or developers, they will love you for keeping the file organized!

detailed view of the corporate web design
detailed view of the corporate web design

detailed view of the corporate web design

The fonts used are Verdana and Rockwell. If you do not have Rockwell, a simple Google search should turn it up. When it comes to web-safe fonts, I’m a big fan of Verdana — both for its legibility and clean characters. Rockwell is an awesome typeface, but I wouldn’t want to read more than a couple lines set in it. This is why Rockwell works great in small amounts, such as for big titles that need a little extra flair. You will notice in the PSD file that, with the exception of buttons, only instances of Rockwell have effects applied to them. This is, of course, because Rockwell is not a web-safe font.

This web design layout was the starting point for an extensive tutorial I wrote for PSD Tuts+ titled How to Elevate Your Web Design Process and Results. For more details about the thought process and Photoshop techniques employed to create this template layout, please refer to the tutorial.