apple

Logo Design: Apples

PauloGabriel — Thu, 06 Oct 2011 10:59:08 +0000

The Logo Design series is up and running. We're thinking ahead and we want to find new ways to sort these listings. Last week we had the second part of the post on logos with mushrooms, but I wish I didn't have found the inspiration for today's post: apples.

About the author

Hello, everyone! I'm Paulo Gabriel, designer from Porto Alegre, Brazil, born in 1984. I have worked as a webdesigner since 2006, but websites and blogs have been a hobby for me since 1999. Here in Abduzeedo, I try to bring only the hot stuff for you... and hope that all of you enjoy my posts! For more cool stuff, you may also follow me on Twitter.

Sponsored Links:

Logo Design: Strawberries and Apples

PauloGabriel — Thu, 19 May 2011 03:30:26 +0000

The Logo Design series is up and running! We're thinking ahead and we want to find new ways to sort these listings. Last week we had a post on logos with pears and grapes... today it's all about logos with strawberries and apples!

As usual, we'll search for logos in these galleries: Logopond, Logo Faves, Logo Moose, Logo from Dreams, Logo Gala, WS Logos, The Logo Mix and Wolda. We hope you all enjoy our selection! Cheers. ;)

Strawberries

Apples

About the author

Sponsored Links:

Design History: Dieter Rams - Less But Better

abduzeedo — Thu, 30 Dec 2010 12:10:25 +0000

Pablo Picasso once said "Good Artists Copy Great Artists Steal" then Steve Jobs mention that in one interview long ago. We all know that Apple products are the best out there, there's no doubt about it, and the main reason about that is because they have the best design. Jonhathan Ive, the chief industrial designer at Apple is a fantastic designer but it's always good to know what and who inspired him to come up with the Apple product designs. We might think that they are pretty unique and new but when we look at Dieter Rams the Pablo Picasso's quote makes even more sense.

About Dieter Rams (Wikipedia)

Dieter Rams (born May 20, 1932 in Wiesbaden, Hesse) is a German industrial designer closely associated with the consumer products company Braun and the Functionalist school of industrial design.

Rams studied architecture at the Werkkunstschule Wiesbaden as well as learning carpentry from 1943 to 1957. After working for the architect Otto Apel between 1953 and 1955 he joined the electronic devices manufacturer Braun where he became chief of design in 1961, a position he kept until 1995.

Rams once explained his design approach in the phrase "Weniger, aber besser" which freely translates as "Less, but better". Rams and his staff designed many memorable products for Braun including the famous SK-4 record player and the high-quality 'D'-series (D45, D46) of 35 mm film slide projectors. He is also known for designing the 606 Universal Shelving System by Vitsœ in 1960.

Rams' ten principles to "good design"

is innovative
makes a product useful
is aesthetic
makes a product understandable
is unobtrusive
is honest
is long-lasting
is thorough down to the last detail
is environmentally friendly
is as little design as possible

Video About Dieter Rams

Works

About the author

Abduzeedo is a blog about design. There are all sorts of articles for those who want to look for inspiration. Also you will find very useful tutorials for the most used applications out there, with a special selection of Photoshop Tutorials and Illustrator Tutorials. You can get in follow us via Twitter at @abduzeedo

Sponsored Links:

Game Center Layout Style in Fireworks

fabiano — Mon, 06 Dec 2010 10:07:22 +0000

This tutorial was inspired on the new Apple Game Center design. Besides to teach you guys how to make all the effects we will use the whole work spent on that to create a cool wallpaper. So check out the resolution of your computer and let's get started!

Step 1

Here I create a 1440x990 pixels canvas. After that we can start with a rectangle, fill with #34884B. Also check out the texture we need to apply.

Step 2

Now we will create other 2 rectangles. First one fill with #27693F and the last one with #286B3C. Check out the image of each effect and texture applied. Also check out the order of the layers until now.

Step 3

Let's start a red rectangle now. We will make some nodes to model this rectangle, so I have a tip, just ungroup the rectangle, you will convert it to a path. With the pen, create the nodes, and also delete some others as I show in the image below. After that use the Subselection Tool "A" to select some points and model the rectangle until you have a draw like the last on the image.

Step 4

Now we will apply a dirty style on this path using a texture. Just duplicate the path you've just created, place the texture bellow the path and use this path as a mask on the texture. Also apply an overlay 70% on this mask.

Step 5

Now we need to put some light onto this texture. Duplicate again the red path and create an ellipse with light pink color fill. Don't forget to apply a feather on this ellipse. Use this other path you've just duplicated to mask this ellipse.

Step 6

Here you will just create a new path inside the our draw. Duplicate again the red path, go to Modify > Alter Path> Inset Path, and use the values I showed on the image.

Step 7

The part of the top and the bottom of the badge we will draw using the pen tool and adjusting the nodes with the "A" tool. Also we will write something inside that. Here we have another tip, draw a curve line and select this line and the text. Then go to Text > Attach to Path. Maybe you will need to make some adjusts with the "A" tool until you have exactly the shape you want.

Step 8

To draw the bottom and top wood bars, we will use simple rectangles and use the Wood texture on Fireworks. You can adjust the saturation and color of this wood if you want, do it with filters. After that, draw a half height rectangle over the wood with alpha 16%.

Step 9

We're close to the end! Fill the layout with new elements, you can follow the PNG file if you need some inspiration!

Final Result

Also put some round rectangles the the both sides of the layout, like Game Center does, this way you can place your desktop icons over those!

Download the Fireworks File

Click here to download the Fireworks file used for this tutorial

About the author

I'm from Brazil, co-founder of Zee with Fabio. Nowadays I like to play with Fireworks, Photoshop and improve my skills in CSS. If you wanna request some posts, please feel free to contact me or follow on Twitter.

Sponsored Links:

Sociology of Apple Objects

paul0v2 — Mon, 25 Jan 2010 14:02:34 +0000

How did objects come to enter the human collective? Inspired by the research work of Bruno Latour, these graphics were created with the idea to speak about the marketing hidden behind objects the main goal of the serie and the forward on is social life. And having some distance about it, there is some construction of a potential user in products.

This work is done by Stephane Massa-Bidal—for more visit http://www.flickr.com/photos/hulk4598/

About the author

Hi there! I'm Paulo Canabarro, 26 year old web designer - paulocanabarro.com I'm from Brazil currently living and working out of Providence RI, USA. I'm truly passionate about design of all kinds, finding and sharing inspiration here has become part of my life. If you like to know more about me or get in touch visit my website paulocanabarro.com Stock me at Twitter and Dribbble

Sponsored Links:

LED Cinema Display in Fireworks

fabiano — Wed, 25 Feb 2009 11:42:52 +0000

We've been using 2 templates in our Wallpapers of the Week articles: the iPhone and the new Apple Cinema Display 24. The iPhone frame we had already shown you how to create it in Fireworks. Now it's time to make the new Apple's display in only a few steps. Take a look and let me know what you think.

STEP 1

Open a new file with the canvas 625 x 625px. Create a rectangle that fit the canvas and fill it with a Radial Gradient with the colors #000 and

STEP 2

Let's start creating the monitor. Draw a rectangle (538x360px). Fill with #000 and border 2px #CCC. Add a Inner Shadow with #FFF and the values: 0 - 65% - 2. Also, set a round corner of 10%.

STEP 3

To create the support of the display, we need to use the Pen Tool. Draw a shape like the picture, than apply a Linear Gradient. The colors for this gradient and the positions of them are: #494949 - #C7C8CC - #C7C8CC - #FFF - #FFF - #C7C8CC.

STEP 4

Now we need to duplicate this support to create a shadow. So after duplicate it, move it a nudge down a little bit; send it to backward and apply a Drop Shadow with the values: 4 - 40% - 4 - 270º.

STEP 5

We need to create the canvas of the display. Draw a rectangle inside of the rounded rectangle and fill it with a nice background image, like your own desktop. Here we're using an image from James White, you can download here if you want.

STEP 6

To create the reflectin on the display, firstly, we need to duplicate the rounded rectangle and bring it to front. After that convert this rectangle to path (just ungroup!). We must create 2 new dots with the Pen Tool and after that delete other ones. See the picture below for reference.

STEP 7

Now just apply a Linear Gradient from #FFF to #FFF. At the bottom of this gradient change the opacity to 0. Also use 40% opacity to the entire path. After that, just move this path 2 pixels left and 2 pixels bottom.

Final Result

We can put an Apple's logo at the bottom and a very small circle at the top to simulate the camera. Now we have a beautiful vector Apple Cinema Display to play with some backgrounds, wallpapers or website layouts. It's definitely an awesome way to show off your work or present them to clients.

Download the Fireworks file

Click here to download the Fireworks file.

About the author

Sponsored Links:

The Joy of Opening an Apple Package

PauloGabriel — Tue, 06 Jan 2009 21:19:22 +0000

If the small pleasures are really the ones that count, there's a special one that I had the opportunity to try in its full power last month. After being a PC user for over 15 years, I've bought my first Mac.

I gotta confess that I got pretty anxious waiting for the delivery. But after 3 days, it finally arrived at my home, my dream came true. I had heard the things people say about unpacking a Mac, of how much of a powerful experience it might be, and I can say, they were right. First, the distributor box was nothing special, just a cardboard regular one, not fancy or anything. But, as I started to open it, I felt like I was in some sort of Pirate/treasure hunt movie, when they open the treasure chest and that golden glow shines upon their face, and this simply makes you think that all the hard work you had to buy it was really, really worth it. I'm totally serious when I say that the Macbook box is probably one of the most beautiful things that exist. It doesn't have any exotic shape, there's not much details, but its finishing is absolutely stunning.

Minimalist, there are only the necessary elements, like a few pictures, some information, and of course, the apple logo. I really felt like I had won the lottery. Actually, the box is such a great piece of design that is almost like you had bought the box, and not what comes inside.

In the podcast they discuss the packaging of an iPod (the 1st generation Nano as it happens) which I also own. Where this resonates with me is the fact that I didn’t purchase this product, it was a Christmas gift and as such I didn’t have the purchase experience; my first interaction with the product was to unwrap the box. At this point I’ll skip to the end; the box for my Nano sits proudly on my shelf. I haven’t retained the box for some perfunctory purpose to store the Nano again when I come to move house. I don’t keep it so that I can put the Nano away every night either. I keep it because, in itself, it’s a beautiful little piece of design that is worthy of display. - John Gibbard from Smorgasbord Design

During the school year, the boxes for his third-generation iPod, PowerBook G4, Mighty Mouse and OS X Tiger sit at home with his parents. For the time being, he contents himself with a rear-lit Apple Pro Keyboard box dangling from the loft of his dorm room. 'I can't imagine throwing them away," he said. "It's more than a record of a serial number; it's a record of a good event that happened in my life.' - Wired

Yet, opening the box it's another great pleasure... getting to see that fantastic piece inside, all yours. And I'm pretty sure I'm not the only one who had this kind of experience. There gotta be much more people who enjoy opening their wish list itens, whether it's a mac or not. Like when we were a child, and we would open our presents under the Christmas tree, just to see that we got what we'd asked for or when you finally got that Pokemon game card you were looking for. Total madness. Wait... madness? THIS, IS, SPARTAAAA!

But we would really love to hear from you guys, what packages really made you happy, these days, or when you were kids, like the Nintendo 64 kids. I do remember the joy of getting my Sega Gensis and my Super Nintendo. Happy, happy, joy, joy! Tell us!! We want to know! Cheers! ;)

About the author

Sponsored Links:

Video of the Week #10

PauloGabriel — Wed, 21 May 2008 14:37:10 +0000

Apple is advertising Coldplay's song "Viva la Vida", which is being sold at iTunes store. This is an awesome, colorful and moody commercial, awesome!

I just wish I knew who did this video... all I know, is that the person who did it, probably had some well known references, such as Chuck Anderson's work (you can check it at NoPattern). And the Abduzeedo crew really liked it, because it fits perfectly to Abduzeedo's theme. This commercial and song could actually be our theme song! Pretty cool, huh?

About the author

Sponsored Links:

PopsiclePod

abduzeedo — Mon, 07 Jan 2008 11:03:25 +0000

Nothing like summertime, beaches, girls with bikinis and lots of popsicles. And if you are in Brazil you might have a nicely surprise if you suddenly discover that the popsicle you bought wasn’t exactly what you expected but an iPod.

For the 2007/2008 summer, the Kibon decided reshape its traditional promotion of the "Palito Awarded", which has existed for more than twenty years and became the property of the brand. Instead of a "thought, won" with sticks, promotion froze 10 thousand iPods in the exact shape and weight of a picolé.

The Bullet, which is developing the idea since March, chatted with Apple to ensure that the devices do not suffer damage, and find a way to adapt the iPod [BB]. Source: Brainstorm9.com.br translated by google.

Well I have eaten lots of those and I haven’t found my iPod yet. I hope I can get one until the end of the summer without breaking my teeth.

kibonipodee.jpg

About the author

Sponsored Links:

Cover Flow in Flash

abduzeedo — Fri, 31 Aug 2007 18:11:21 +0000

I always liked the Cover Flow feature in itunes, you can flip through your music and video collections as if you are flipping through your cds. Then some weeks ago I read this amazing tutorial about how to create a mac style photo flip gallery. They used a flash component called photoFlow and you can find it at Flashloaded.com.

Cover Flow is a three-dimensional graphical user interface for visually rummaging through one's digital music libraries via cover artwork. It was created by an independent Macintosh developer, Jonathan del Strother. Some had viewed CoverFlow as a must-have Mac OS X app throughout 2005 and 2006 for its ability to give its user an intuitive, emotional, and efficient way to flip through one's record collections visually.

I couldn’t resist and had to try it. The price almost changed my mind, however I was working on a project which needed a photo gallery and this Cover Flow feature would fit like a glove. So I spent the 60 dollars and bought it at http://www.flashloaded.com/flashcomponents/photoflow/

I have to say, it’s an excellent component. Very easy to use, it allows you to customize pretty much everything like transparencies, spacings, sizes and etc... Besides, it gives a very beautiful impression.

Below I show an example using it.

This is alternative content.

You can find more gallery scripts and components for a much more affordable price at http://www.flashden.net/

About the author

Sponsored Links:

Leopard Starburst effect in Photoshop

abduzeedo — Tue, 12 Jun 2007 03:44:17 +0000

Here we are, in June, another WWDC with Steve Jobs and lots of cool stuff. This time what impressed me the most was the new Mac OS X, called Leopard. The finder has changed, finally, besides that, some cool features like the cover flow for files, quick view and time machine are great and make me really want to use it.

Well, one thing that I loved was those new Mac OS banners, like the space, stars and those dust and flares. Awesome. So I tried to do that in Photoshop, and I have to say, it’s not that difficult, and this is what I want to show here.

1- Create a new document: Fill the background with black;

2 - Create the small stars: Duplicate the layer and add a noise>15%>gaussian>monochromatic.

3 - Adjust the Brightness/Contrast so there won’t be too many stars.

4 - Big Stars: Duplicate the small stars layer and apply a Brightness / Contrast again.

5 - Scale it like three times its size, we want to create bigger stars.

6 - Apply Images>adjustments>Threshold: This will show only a few stars. Apply SCREEN as blending options

7 - Refining the stars: Apply a mask on the layer and with the eraser with like 200px start deleting some parts of the layer. after that the stars won’t be too uniform anymore.

8 - Create some light: Add a new layer and create Clouds. Filters>Render>Clouds. Your background color has to be white and the foreground black or vice-versa.

9 - Apply a Hue/Saturation in the cloud layer and COLOR DODGE as a blending option.

10 - Now apply a Hue/Saturation in the big stars layer.

11 - Create some flares: I did that using some free ps brushes which you can find for free at http://www.psbrushes.net/ or http://www.brusheezy.com/brushes. Change some presets like Diameter, Spacing and play with that, testing the Shape Dynamics, Scattering, Other Dynamics and etc... Don’t forget to add some glow in the stars through the Layer Styles.

12 - Creating the Starburst Light: Create a Custom Shape, like the one I chose in white, apply a Gaussian Blur and after that a Twirl. Scale it down until it gets a perfect circle.

13 - Create a new Layer: Fill it in black and merge it with the Starburst layer.

14 - Add a Radial Blur to the Starburst and after that change the Hue/Saturation. Colorize it until you get a green color.

15 - Duplicate the first Starburst Light, reduce its size and apply again a Hue/Saturation, this time set a red/orange color to it.

16 - Addin the Text: For the X or Z just apply a simple Bevel and Emboss plus the Contour option.

17 - Create the reflections on the type: Create a mask and fill it with a gradient from white to black. Set SCREEN as blending options.

Final Result:

Download the Photoshop File

Click here to download the Photoshop file used for this tutorial

Plus, there are good sites with tutorials showing how to create a galaxy, stars and stuff like that. Bellow some that I used as reference.

leopard_effect.png

apple

Logo Design: Apples

The Logo Design series is up and running. We're thinking ahead and we want to find new ways to sort these listings. Last week we had the second part of the post on logos with mushrooms, but I wish I didn't have found the inspiration for today's post: apples.

About the author

Sponsored Links:

Logo Design: Strawberries and Apples

The Logo Design series is up and running! We're thinking ahead and we want to find new ways to sort these listings. Last week we had a post on logos with pears and grapes... today it's all about logos with strawberries and apples!

Strawberries

Apples

About the author

Sponsored Links:

Design History: Dieter Rams - Less But Better

About Dieter Rams (Wikipedia)

Rams' ten principles to "good design"

Video About Dieter Rams

Works

Further reading

About the author

Sponsored Links:

Game Center Layout Style in Fireworks

This tutorial was inspired on the new Apple Game Center design. Besides to teach you guys how to make all the effects we will use the whole work spent on that to create a cool wallpaper. So check out the resolution of your computer and let's get started!

Step 1

Step 2

Step 3

Step 4

Step 5

Step 6

Step 7

Step 8

Step 9

Final Result

Download the Fireworks File

About the author

Sponsored Links:

Sociology of Apple Objects

About the author

Sponsored Links:

LED Cinema Display in Fireworks

STEP 1

STEP 2

STEP 3

STEP 4

STEP 5

STEP 6

STEP 7

Final Result

Download the Fireworks file

About the author

Sponsored Links:

The Joy of Opening an Apple Package

If the small pleasures are really the ones that count, there's a special one that I had the opportunity to try in its full power last month. After being a PC user for over 15 years, I've bought my first Mac.

About the author

Sponsored Links:

Video of the Week #10

Apple is advertising Coldplay's song "Viva la Vida", which is being sold at iTunes store. This is an awesome, colorful and moody commercial, awesome!

About the author

Sponsored Links:

PopsiclePod

Nothing like summertime, beaches, girls with bikinis and lots of popsicles. And if you are in Brazil you might have a nicely surprise if you suddenly discover that the popsicle you bought wasn’t exactly what you expected but an iPod.

About the author

Sponsored Links:

Cover Flow in Flash

About the author

Sponsored Links:

Leopard Starburst effect in Photoshop

Final Result:

Download the Photoshop File

About the author

Sponsored Links: