Smashing Magazine - we smash you with the information that will make your life easier. really.
iPhone PSD Vector Kit
Today, we are glad to release the iPhone Starter Kit, a set that comes with several button elements as well as six different iPhone interface options. This pack may be useful for mobile developers and front-end designers who need a professional way to show mock-ups to clients or to work out ideas. This set was designed by Renee Rist especially for Smashing Magazine and its readers.
Download the icon set for free!
You can use the set for all of your projects for free and without any restrictions. You can freely use it for both your private and commercial projects, including software, online services, templates and themes. The set may not be resold, sub-licensed, rented, transferred or otherwise made available for use. Please link to this article if you would like to spread the word.
- preview
- Download the set (in PSD) (.zip, 2.8 MB)
Behind the design
As always, here are some insights from the designer herself:
“This iPhone Vector Pack was created entirely in Photoshop. The elements in this set are a combination of vector and real screenshots. Last month, I was asked to create a mobile website mock-up using the iPhone as a medium. I needed to show several parts of the interface, none of which I had graphics for. I set out to create an iPhone “starter kit” for myself.
This iPhone Vector Pack comes with several button elements, as well as six different iPhone interface options (which you can turn on and off in Photoshop). I hope this freebie pack will be useful for mobile developers and front-end designers who need a professional way to show mock-ups to clients or to work out ideas.”
Thank you very much, Renee! We appreciate your efforts.
Last But Not Least
We are constantly looking for creative designers and artists. You may not know it yet, but we may feature you in one of our upcoming posts.
If you would like to release a free high-quality font, a WordPress theme, Photoshop brushes, a Drupal theme, some wallpapers or an icon set, please contact us. We would like to support you (both financially and with the broad readership of Smashing Magazine). (al)
The team here at Smashing Magazine. Mostly Sven & Vitaly.
- 48 Comments
- 1
- 2
November 26th, 2008 5:37 amvery very nice
- 3
November 26th, 2008 5:43 amty for nothing…
nothing to learn anside the psd.. - 4

- 5
November 6th, 2009 12:58 amAlbiet, more restricted.
- 5
- 6
November 26th, 2008 6:19 amThis is really useful for native application mockups.
I’d love to see one more geared towards WebApp development…
Sadly my ‘Photoshop skills’ are more like ‘Photostop kills’!
- 7
- 8
November 26th, 2008 6:59 amGreat!
- 9
November 26th, 2008 7:17 amVery nice! However for something more robust (and updated based on feedback) see here: http://www.teehanlax.com/blog/?p=764
- 10
November 26th, 2008 7:30 amThanks everyone!
- 11
November 26th, 2008 7:36 amThis is awesome! It looks absolutely gorgeous. Perfect to do professional mockups and designs. :)
- 12
November 26th, 2008 8:01 amAwesome.
“Not for Blackberry RIM Use” should be part of the license agreement – http://www.engadget.com/2008/10/08/vodafones-blackberry-storm-art-department-all-soon-to-be-fired/
- 13
November 26th, 2008 8:50 amNice!
- 14

- 15
November 26th, 2008 1:09 pmhttp://www.teehanlax.com is the better one, i used it on a speech how ipods are antisocial. haha
- 16
November 26th, 2008 2:47 pmThanks it can prove to be usefull! when I learn photoshop ;-)
- 17
November 26th, 2008 4:26 pmThanks for this, this is one of the best resource downloads in a very long time! Great work people.
- 18
November 26th, 2008 4:54 pmGreat resources (both the set in the article and in the comments)
Best link all week. Thanks Guys!
- 19
November 26th, 2008 8:01 pmthank you~~~~
- 20
November 26th, 2008 8:57 pmThanks a Lot - 21
November 27th, 2008 12:21 amnice design
- 22
November 27th, 2008 1:02 amHm, but most of the elements inside are just flattened. The entire keyboard is flattened layer, there are no layer styles to define buttons and all that.
Actually, only very little portion of UI is recreated by you using layer styles, most of it is just screengrabbed from iPhone and pasted in Photoshop.
Very misleading.
- 23
November 27th, 2008 5:09 amé o baguio é bom memo!
- 24
November 27th, 2008 9:39 am@Daemon – Why would you need to alter the keyboard? All the items you’d need to alter for a presentation/mock-up are editable (buttons, pressed keyboard button, application, text, pop-up area, etc). If someone wanted to alter the keyboard, that is not iPhone standard, and it would be misleading to the client (or end-user).
I flattened standard layers to save on file size. No one should need to alter iPhone standards anyhow, and if they do — that’s out of the scope of what this was designed for. :)
I’m sorry you didn’t enjoy it.
- 25
November 27th, 2008 10:21 amThank you SOOOO much for sharing!!!! It was super useful for my projet!
- 26
November 28th, 2008 12:58 am@Renee, nah man, it was a great start to push me into searching full PSD of iPhone UI. Why would i need full PSD UI? Well, for creating iPhone ready websites and applications. Simple.
- 27
November 28th, 2008 5:16 amVery nice! Thank you Renee Rist & SM
- 28
November 28th, 2008 7:13 amGorgeus!
- 29
November 28th, 2008 7:36 amThis is a GREAT template to have in the arsenal. This might just appear in OTS graphics for news… if it does I’ll post a screenie.
- 30
December 27th, 2008 5:37 amgracias.!
- 31
January 6th, 2009 3:05 pmسلام سایت بسیار جالبی دارید واقعا خوب کار کردید
http://www.wbx7.blogfa.cim
متشکرم
{هادی از ایران استان بوشهر } - 32
January 14th, 2009 7:37 pmХорошо сделано!
- 33
January 15th, 2009 3:09 amThat´s shit!! Cause….there are no VEKTOR-elements in that file!!! :-((((
- 34
January 31st, 2009 10:37 pmOMG!!! Thanks!!!
- 35
March 21st, 2009 2:14 pmthank you looks nice :) :) :) :) :) :) :) :) :) :) :) :)
- 36
March 21st, 2009 2:15 pmthank you looks nice :) :) :) :) :) :) :) :) :) :) :) :)
- 37
April 18th, 2009 8:40 amMany in the UX community like to spend quite a bit of time in “wireframing mode”, where simply black line sketches show a developer how the designer is thinking. This helps to communicate ideas, without having to do long trips through a design done in photoshop. At the end of the day, the photoshop glossies are required, but to get to something that is close to final, wireframes are an awesome tool.
I created this Visio wireframing toolkit, available for free to help the UX community out. It can be a great compliment to this and other iPhone mockup PSDs out there (especially the awesome set at teehanlax.com). Hope it is of benefit.
URL to the wireframe toolkit at: http://www.bretteddy.com/iphone/
Do great things. Cheers. Brett
- 38
June 15th, 2009 2:45 amjust for testing – great stuff
- 39
July 31st, 2009 11:24 pmAny chance of a higher-resolution mockup/template? Would love something like this but at higher resolution for poster-size prints! Thanks! I know that the UI elements are vector, but a high-resolution iphone render would be awesome. mikee60369 AT “aol” dot com.
- 40
August 9th, 2009 12:14 amShare This/Blog ItDownloadSend to MobileAlsomanicho’s profilemanicho’s gallerymanicho’s prints … çelik konstrüksiyon iPhone PSD for snapshots, icons, etc.
- 41
October 15th, 2009 5:47 amGreat Job! This was perfect for an ad I had to do!
- 42
November 5th, 2009 7:22 pmWhat a great resource, thank you.
- 43
November 5th, 2009 8:46 pmWow! Great Work
- 44

- 45
December 18th, 2009 8:16 amWell I think it was a great job Renee. I may be using it to teach students about computers, and after seeing it I might put together a poster for our computer lab at work where students will be taking a new course in iPhone software development starting in January.
- 46
January 13th, 2010 9:52 pmThanks for sharing Renee! – avn
- 47
January 20th, 2010 6:17 pmvery nice~
- 48
February 8th, 2010 5:10 pmWow, excelente… justo lo que andaba buscando ñ_ñ
- 00
There are no trackbacks at this time. If you are interested in leaving a trackback, please use this URL.
Leave a Comment
Make sure you enter the * required information where indicated. Please also rate the article as it will help us decide future content and posts. Comments are moderated – and rel="nofollow" is in use. Please no link dropping, no keywords or domains as names; do not spam, and do not advertise!
Interact
Popular
- 100 Wordpress Themes
- Photoshop Tutorials
- Fantastic Wallpapers
- 40+ Excellent Freefonts
- Dual-Screen Wallpapers
- Wordpress Themes for 2009
- Illustrator Tutorials
- Incredible Free Icon Sets
- High-Quality Free Fonts
- 30 Scripts For Galleries
- Photoshop Text Effects
- Useful Icon Sets
- Web Design Trends
- iPhone Wallpapers
- Before Launching a Website
- CSS Layouts And Templates
- Photoshop Actions
- Stunning Pictures and Photos
- Fantastic HDR Pictures
- Logo Design Tutorials
- Free Design Templates
- 10 Mistakes In Logo Design
- Photoshop Custom Shapes
- 40 Creative Design Layouts
- 8 Layout Solutions
- 53 CSS Techniques
- Photography Techniques
- Black & White Photography
- Styling Design Elements
- CSS-Based Forms
- 50 jQuery Techniques
- 50 Portfolio Websites
- 50 CSS Techniques
- Creative Logo Designs
- Desktop Wallpapers
- 25 Open Source Mac Apps
- 50 Free Icon Sets
- lovely-css: a grid-based CSS framework - http://bit.ly/ayA0wb
- How The CSS Selector nth-child Works - http://bit.ly/cgPMqe
- 33 New High Quality Adobe Illustrator Tutorials - http://bit.ly/bTgFbu
- How to Drastically Improve Your Designs - http://bit.ly/a9L1sb
- A Quick Look at Mobile Web Designs - http://bit.ly/9TCWCG
- How to Test your JavaScript Code with QUnit - http://bit.ly/da853c
- jQuery 1.4 API Cheat Sheet - http://bit.ly/5zYYnE




(8 votes, average: 3.75 out of 5)
Nice! Long live the iPhone