[Web Design] Showcase of Flat Web Designs – フラットWebデザインの作例まとめ
フラットなWebデザインのサイトをまとめた記事。Mobile OSやアプリのUIなどから始まったフラットデザインの流れは、もうすっかりWebのデザインも道連れにされていますな。こういうの見てると「もうスキューモーフィックなデザインはしちゃイケないのね( ´・ω・)」とか思っちゃいます。いやまぁしたらアカンって事ぁないんだろうけど。今風なWebデザインのネタ帳に是非。
Tag Archives: FlatUI
[Photoshop] Long Shadow Generator – ロングシャドウを描いてくれるフォトショップ用プラグイン
地味に流行ってますよね、ロングシャドウ。フラットデザイン下での数少ない装飾手法といいますか、なんかこう流行ってるしとりあえず描いちゃえ的なアレゲな感じはしますけども、最近チラホラ見かけます。そのシャドウ部分をサクっと描いてくれるPhotoshop用機能拡張がこちら。長さと透明度を指定してGenerateするだけです。とてもシンプル。そしてフリー。Photoshop CS6用とCC用双方のプラグインが用意されています。ロングシャドウを量産したいデザイナーさんに是非これひとつ。
[Framework] ChocolateChip-UI – iOS 7のルック・アンド・フィールに早速対応したモバイル端末向けCSSフレームワーク
iOS 7のフラットUIに早速対応した、モバイルデバイス向けのCSSフレームワーク。iOSだけでなく、AndroidのJelly BeanやWindows Phone 8にも対応しています。それぞれの純正UIに沿ったルック・アンド・フィールに個別に対応するというアプローチのフレームワークのようです。ファイル一式ダウンロードしましたが、それぞれの環境に個別のHTMLで対応するという手法でした。WebサイトにおいてもOS純正のUIを再現できれば、App内のWebViewによる遷移がある場合でも違和感なく作れそうです。Try on you Mobile Deviceから動作デモを見る事もできます。
[iOS 7] PARALLAX WALLPAPERS – iOS 7のParallax Effect (視差効果)に対応した壁紙ギャラリー
昨晩正式リリースされたiOS 7、わりと派手な変化のひとつに3D壁紙のパララックスエフェクトがあります。早速あいぽんを傾けて「うひゃー奥行き感じるZEEEE！」みたいな感じでひとしきりハシャいだ人多いんじゃないでしょうか（俺です）。けどこれ、今までん壁紙を指定した際に、なんか変な感じしません？ 解像度ピッタリで作った壁紙の場合、ちょっと拡大されてドットがにじむんですよね。理由は簡単で、iOS 7から壁紙のサイズが変更になった事にあります。奥行きを表現する以上、通常は見えていない位置にも絵を描画する必要があるので、実際のiPhoneの解像度よりも少し大きめサイズの画像が壁紙として指定されるようになってます。というわけで各種iPhoneごとのiOS 7用の壁紙のサイズがこちら。
- iPhone5/5s/5c：744px x 1392px
- iPhone4/4s：740px x 1196px
前に比べてちょっと大きくなってます。で、この新しい壁紙のサイズに対応したギャラリーサイトがチラホラ出てきました。わりと趣味がイイので自分もいくつかDLしましたが、iPhone 4系のサイズものもが多いのがちょっとアレではあります。まぁこの視差効果をオフにするとあいぽん速くなるって話もあるんですけどね・・・。
[UI Design] iOS7 Before and After Pics – iOS 7、ビフォーアフター
いやーアレですな、いよいよ今晩ですな、iOS 7。けどまぁ日本時間だと深夜2時のようなので、まぁ明日会社来てからブチ込もうかと思っちょります。んでこのサイト、iOS 7にする前と後で、各Appがどのように変わるのかをビフォーアフター形式で紹介してます。アフターを掲載する時点で、ここで紹介されているAppはiOS 7に対応しているって前提であるとも言えますね。正直わたくしこの変化好きでございます。一部アイコンがダサくなったりアレゲな部分も少しありますが、基本的にわたくし“よく訓練されたAppleの犬”でございますゆえ、股を開いて受け入れる体制バッチリなアレでございます。今のあいぽん5、もう1年経つからクリーンインストールするにもちょうどイイ時期だしね。そんなわけでAppleの犬のみなさん、今晩を楽しみに待ちましょう。
[UI Design] Made for iOS 7 – iOS 7対応済みのアプリギャラリー
いよいよ明日からDL開始となるiOS 7ですが（日本時間だと深夜開始になんのかな？）、あの新しいフラットUIってAppごとに個別に対応が必要っぽいんですよね。このTumblrブログではすでに対応済みのアプリのUIがギャラリー形式で紹介されています。これからiOS 7のフラットUIに対応しようという場合の参考になりそうです。アイコン作例も掲載されているのがナイス。アプリ作る側も色々大変ですな・・・。