チュートリアルのブログ

設計は、iPhone用:リソース




37 Signalsが一度は、iPhoneのための設計について述べた

設計は、iPhone用の印刷やWebデザインのハイブリッドのようです。

みんな知っているウェブ不確実性にはびこっている。 我々は、ビューアの画面サイズや解像度を知っておりませんが、誰かの画面のガンマを知らない場合は、特定の書体および/または正確には、ブラウザ内でどのように顔をレンダリングするんだ、我々が知らない私たち彼らなどを使用する予定しているブラウザが知らない

しかし、ペーパーでは、他の一方で、コントロールがいっぱいです。 固定サイズ、固定の顔、固定色。 (あなたの色や紙等で宿題をやったと仮定します)何を印刷どおりのものを見ている。

そのため、iPhoneには、奇妙な取り合わせです。 これは、ウェブでは、物事をスクロールしたり、データがリモートサーバーからプルされますが、それもかなり良いとはとてもさわやかなデザイン演習クールな固定幅、固定ブラウザ、固定書体などだ。

非常にそうだね。 iPhone用のデザインへの行き方だけでも楽しいもの。 クロスは心配ないのブラウザのテストは、時代遅れの技術に対応するためにことを心配せず。 どのようなデザインを得るものです!

ここにあなたのiPhoneのデザインプロジェクトを一緒に行くを取得するいくつかのリソースがあります。

Photoshopファイル


無料でiPhoneのアイコンをPSDファイル/スナップショット/何


iPhone GUIのPSDファイル


iPhoneインターフェイスPSDファイル

iPhoneのアイコンスタイル。キットPSDファイル

Appleの公式情報


はiPhone Devセンター
ビデオ:iPhone SDKの入門 (無料登録が必要です)
グラフィックス&アニメーションのコーディング方法のために

チュートリアル


学ぶ方法は、iPhone用に開発する

設計は、iPhone用(とき)1を保持していない


スリックiPhoneの作成/携帯インターフェイスの任意のRSSフィードから

iPhoneのインターフェイスにはいくつかのウェブサイトの設計、iPhone用 (リスト)


質問エ:iPhone専用インターフェイスのデザイン (ビデオを含む)

実用的な電子商取引: ウェブサイトの設計は、iPhone用

iPhoneのアイコン

設計は、iPhone(パート1)(ファビコン)

どのようにWebサイト用のカスタムAppleのiPhoneのアイコンを作成する


どのようにPhotoshopを使ってWebclipもiPhoneのアイコンを作成する

その進捗状況のEvolutionは配送状況アイコンの (非常にクールなアニメーション)

有用なコードスニペット

JavaScriptを使って、iPhoneの検出:

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

iPhoneのビューポートのサイズを設定します:

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

配置は、あなたのWebページのheadセクションです。 場合は、静的な幅を強制するには、変更"デバイスの幅を特定のサイズ"に。 iPhoneの画面サイズ320 × 480pxです。

下にスクロールし、ページの読み込みには、メニューバーを非表示にする:

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

もっとiPhoneニュースやレビューは、最新のiPhoneアプリ、AppCraverをチェックアウトするには。



コメント

iPhone"を設計するための3つの応答:リソース"
  1. エリカニコル さんの意見:

    この時期にsooooされました! 素敵なポスト!

  2. トム さんの意見:

    ジェイルブレイクしたiPhoneに対するリソースの?

  3. アデレードの設計 さんの意見:

    これにより、設計のヒントのおかげで素晴らしいです

チュートリアルのブログ