ウェブデザインの世界において、Apple(アップル)スタイルがトレンドのひとつになっていると思います。
たとえば、余白をたくさん使ったレイアウトや、ガラスに反射しているようなアイコン、使われているフォントなど多くのウェブサイトが取り入れているデザインとなっています。
先日ご紹介した、「フォトショップでApple(アップル)風でそっくりなメニューバーを作る方法」もそのひとつです。
今回はそんなAppleスタイルにまつわるさまざまなチュートリアルを20個まとめた「20 Apple-inspired Tutorials for Practice Web Designers」をご紹介します。
Apple風ボタンの作り方からアイコン、iPhoneなどの製品をフォトショップで作ったりすることができるチュートリアルが揃っています。
ダメ押しでApple社のホームページのレイアウトの作り方まで紹介されています。
その中から特に使いそうなチュートリアルをいくつかピックアップしてみました。
これさえおさえれば、アナタもAppleマスターです。(笑)
詳細は以下より。
Appleホームページのタブつきメニューバーの作り方を紹介しています。
この微妙なグラデーションがAppleの特徴のひとつとも言えますね。
少し前まで使われていた、ツルツルとした質感のボタンの作り方を紹介しています。
レイヤースタイルにちょっと手を加えるだけのお手軽チュートリアルです。
こちらが現行のAppleホームページで使われているボタンですね。
シンプルなつくりですが、質感の表現の仕方がやはり上手ですね、アップル。
みなさんの周りでも必ず一人は持っているiPhone。
そんなツヤ感たっぷりなアイコンの作り方を紹介しています。
Design the Mac OS X Leopard Folder
先日Snow Leopardが発売されましたが、こちらはLeopardで使われていたフォルダアイコンの作り方を紹介しています。
How To Create the iTunes Icon in Illustrator
イラストレーター用のチュートリアルですが、立体感をよくあらわしていて、お気に入りのひとつなんでアップしておきます。
Apple iMac – Photoshop tutorial
デザイン済みで簡単に編集可能なPSDファイルもありますが、デスクトップ型iMacをゼロから作ることもできます。
Design a Shiny Photorealistic Apple Remote
本物と見間違うほどの高品質なAppleリモートの作り方も紹介されています。
ここまでいくとアートの世界ですね。
Apple iPhone Mobile Phone Design
「ゼロからオリジナルのiPhoneを作りたい。」
そんな人はこちらのチュートリアルを参照にしてみてはいかがでしょうか。
すべてのパーツをフォトショップでデザインしています。
こちらはApple社ホームページをベースにしたウェブレイアウトになっています。
グリッドを使っているため、シンプルで見やすいサイトに仕上がります。
サンプル用PSDファイルがダウンロードできるので、そちらに加工を施してもいいかもしれません。
こうやってApple関連のチュートリアルを集めると、どれもウェブサイトに使われているテクニックばかりなのに驚きです。
Photoshop VIPもサイトリニューアル中なんで参考にさせてもらいますよ。
参照元にはこれら以外にもたくさんのチュートリアルが掲載されています。
よろしかったら、あわせてどうぞ。
[参照元 : 20 Apple-inspired Tutorials for Practice Web Designers – Beautiful Life]