Menu Search
Jump to the content X X
Smashing Conf San Francisco

We use ad-blockers as well, you know. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. upcoming SmashingConf San Francisco, dedicated to smart front-end techniques and design patterns.

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 Rist1 especially for Smashing Magazine and its readers. [Content Care Nov/09/2016]

iPhone Vector Pack2

Download the icon set for free! Link

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.

iPhone Vector Pack3

Behind the design Link

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 Link

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 us6. We would like to support you (both financially and with the broad readership of Smashing Magazine).

Further Reading on SmashingMag: Link

(al)

Footnotes Link

  1. 1 http://www.ribbonsofred.com
  2. 2 https://www.smashingmagazine.com/images/iphone-vector-pack/preview.jpg
  3. 3 https://www.smashingmagazine.com/images/iphone-vector-pack/preview.jpg
  4. 4 https://www.smashingmagazine.com/images/iphone-vector-pack/preview.jpg
  5. 5 https://www.smashingmagazine.com/images/iphone-vector-pack/iphone-gui.zip
  6. 6 https://www.smashingmagazine.com/contact/index.php/form
  7. 7 https://www.smashingmagazine.com/2010/05/web-development-for-the-iphone-and-ipad-getting-started/
  8. 8 https://www.smashingmagazine.com/2014/10/create-assets-for-multiple-scale-factors/
  9. 9 https://www.smashingmagazine.com/2016/08/a-beginners-guide-to-progressive-web-apps/
  10. 10 https://www.smashingmagazine.com/2014/09/testing-mobile-emulators-simulators-remote-debugging/
  11. 11 https://www.smashingmagazine.com/2016/11/worlds-best-open-device-labs/

↑ Back to top Tweet itShare on Facebook

The Smashing team loves high-quality content and cares about the little details. Through our online articles, Smashing Books, eBooks as well as Smashing Conferences, we are committed to stimulating creativity and strengthening the web design community’s creative forces.

  1. 1

    Nice! Long live the iPhone

    0
  2. 2

    very very nice

    0
  3. 3

    ty for nothing…
    nothing to learn anside the psd..

    0
  4. 4

    This 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’!

    0
  5. 8

    Nice job. We built one a few months back too and have been adding to it ever since. It’s all shape based (vector) as well.

    0
  6. 9

    Great!

    0
  7. 10

    Thanks everyone!

    0
  8. 11

    BitBot - Megowatt

    November 26, 2008 7:36 am

    This is awesome! It looks absolutely gorgeous. Perfect to do professional mockups and designs. :)

    0
  9. 12

    Nice!

    0
  10. 13

    Thanks it can prove to be usefull! when I learn photoshop ;-)

    0
  11. 14

    Thanks for this, this is one of the best resource downloads in a very long time! Great work people.

    0
  12. 15

    Great resources (both the set in the article and in the comments)

    Best link all week. Thanks Guys!

    0
  13. 16

    nice design

    0
  14. 17

    Hm, 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.

    0
  15. 18

    é o baguio é bom memo!

    0
  16. 19

    @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.

    0
  17. 20

    Thank you SOOOO much for sharing!!!! It was super useful for my projet!

    0
  18. 21

    @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.

    0
  19. 22

    Very nice! Thank you Renee Rist & SM

    0
  20. 23

    Gorgeus!

    0
  21. 24

    This 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.

    0
  22. 25

    gracias.!

    0
  23. 26

    That´s shit!! Cause….there are no VEKTOR-elements in that file!!! :-((((

    0
  24. 27

    OMG!!! Thanks!!!

    0
  25. 28

    just for testing – great stuff

    0
  26. 29

    Any 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.

    0
  27. 30

    Tom Davenport

    November 5, 2009 7:22 pm

    What a great resource, thank you.

    0
  28. 31

    Srinivas Tamada

    November 5, 2009 8:46 pm

    Wow! Great Work

    0
  29. 32

    Albiet, more restricted.

    0
  30. 33

    Well 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.

    0
  31. 34

    Thanks for sharing Renee! – avn

    0
  32. 35

    very nice~

    0
  33. 36

    Thank you, Renee, for designing and sharing this kit. It was a tremendous help during the creation of our tiny iphone key tags :)

    0
  34. 37

    Alex Flueras

    April 30, 2010 8:12 pm

    Thanks so much!

    0
  35. 38

    Varun Kekre

    May 2, 2010 10:27 am

    Thank You so much!! You make things so simple.
    Thanks again.

    0
  36. 39

    very nice! thank you :)

    0
  37. 40

    Nice one. Thanks Man.

    0
  38. 41

    The set is wow quality.

    0
  39. 42

    Thanks

    0
  40. 43

    Hi this very helpfull for me.. developed iPhone & iPad.

    Thanks

    0
  41. 44

    Thank you very much! This was quite generous of you to do and share!

    0
  42. 45

    This looks really nice! Thank you very much, this is really helpful for mockups and GUI design on the device.

    0
  43. 46

    Thanks for providing this for a free download. This just saved me loads of time doing a website mockup for a client. Much appreciated.

    Martin Oxby

    0

↑ Back to top