Designing for the iPhone: Ressourcen

37 Signale sagte einmal über den Entwurf für das iPhone:

Die Projektierung für das iPhone ist wie ein Hybrid aus Print-und Webdesign.

Die Web-wir alle wissen, ist voller Unsicherheit. Wir wissen nicht, dem Betrachter den Bildschirm oder Auflösung, wir nicht das Gamma des Bildschirms jemanden kennen, wissen wir nicht, wenn sie eine bestimmte Schriftart und / oder genau, wie das Gesicht macht auf die in ihrem Browser, bekam haben wir weiß nicht, der Browser sie benutzen wollen, etc.

Aber Papier, auf der anderen Seite ist der Kontrollen voll. Feste Größe, fest steht, feste Farben. Was Sie Druck ist genau das, was jemand sieht (vorausgesetzt, Sie haben Ihre Hausaufgaben Farbe und Papier usw. getan).

Also das iPhone ist eine seltsame Mischung. Es ist das Netz, und die Dinge können zu blättern, und die Daten von Remote-Servern gezogen, aber es ist auch eine feste Breite, eine bestimmte Browser, feste Schriften, etc. It's pretty cool und ein wirklich erfrischendes Design auszuüben.

Es ist sehr wahr. Erste Schritte für die iPhone-Design macht einfach Spaß. Keine Sorgen über Cross-Browser-Tests, keine Sorgen darüber, dass sie auf veraltete Technologien gerecht zu werden. Was Sie Design ist was Sie erhalten!

Hier sind ein paar Ressourcen zu bekommen wirst du mit dem iPhone Design-Projekt.

Photoshop-Dateien

Free iPhone PSD-Datei für Symbole / snapshots / whatever

iPhone GUI PSD

iPhone Interface PSD-Datei

iPhone Style Icon. psd Kit

Offizielle Apple-Ressourcen

iPhone Dev Center
Video: Einführung in die iPhone SDK (kostenlose Registrierung erforderlich)
Grafik & Animation Coding How-To's

Tutorials

Learn How To Develop For The iPhone

Designing for the iPhone (wenn Sie nicht im Besitz einer)

Erstellen Sie ein Slick iPhone / Mobile Interface aus RSS-Feed

Designing for iPhone (Liste von mehreren Websites mit dem iPhone-Schnittstellen)

Ask ET: iPhone-Interface-Design (inkl. Video)

Praktische eCommerce: Website-Design für das iPhone

iPhone Icons

Die Projektierung für das iPhone (Teil 1) (favicon)

So erstellen Sie eine benutzerdefinierte Apple iPhone Symbol für Ihre Website

So erstellen Sie ein Webclip iPhone Icon mit Photoshop

Evolution of the Delivery Status Icon (sehr coolen Animation über seine Fortschritte)

Nützliche Code-Snippets

Erkennen der iPhone mit JavaScript:

<script type="text/javascript"> if (navigator.userAgent.indexOf('iPhone') != -1) { { // Do something iPhone Specific! } </script> 

Setzen Sie die iPhone Viewport Größe:

 <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;"> 

Setzen Sie sich in Ihrem Web-Seiten Kopfteil. Wenn Sie eine statische Breite Kraft, zu ändern "device-width" zu einer bestimmten Größe. Die iPhone-Bildschirm Abmessungen sind 320 x 480px.

Blättern Sie zum Ausblenden der Menüleiste beim Laden der Seite:

 <script type="application/x-javascript"> addEventListener('load', function() { setTimeout(hideAddressBar, 0); }, false); function hideAddressBar() { window.scrollTo(0, 1); } </script> 

Weitere iPhone News und Meinungen über die neuesten iPhone apps, lesen Sie in AppCraver.