DarkModeのデザインを中心とした色彩設計の考え方 - くらげだらけ
こんにちは、くだくらげです。最近ははじめてのUIデザインという本を共著で書きました。 おかげさまでたくさんの人に読んでいただいて、コメントをもらえたりして嬉しいです。ありがとうございます！ PEAKSさんから出版しており購入できますので、よろしければ手にとってみていただけると嬉しいです。 peaks.cc 概要 WWDC 2019で新しく発表されたiOS13でOSレベルでのDarkMode設定が搭載されることになりました。MacOSの方は以前より追加されていましたが、iOSではなかったので個別のアプリが各々対応していました。 今回、iOSにもDarkMode設定が標準搭載されたことによって、iOSアプリのダークモード対応が必然的に迫られることになって来るのではないかと思っています。 ダークモードを好んで使う人は一定数存在していて、かく言う私もダークモードを好んで使っています。目に優しいだっ
デザイナーもWWDCのビデオを見て勉強すると良い理由 - くらげだらけ
こんにちは、くだくらげです。最近ははじめてのUIデザインという本を共著で書きました。 おかげさまでたくさんの人に読んでいただいて、頑張って書いたかいがありました。ありがとうございます！ PEAKSさんから出版しており購入できますので、よろしければ手にとってみていただけると嬉しいです。 peaks.cc 概要 今回は、デザイナーもWWDCのセッションを見ると良いよ！という紹介をしたいと思います。 ご存知の方も多いと思いますが、WWDC（Worldwide Developers Conference）は、Appleが毎年開催している開発者向けのイベントで、近年では新しいOSの発表が行われています。 もっとも有名なのはKeynote（イベントの初日に行われる基調講演）で、そこで最初に大まかなトピックについて発表されるため注目されることが多いです。 WWDCには他にも個別のセッションとLab（Ap
SketchからObjective-CやSwiftのコードが生成できちゃう？！新デザインツールAnima Sketch to Codeが間もなくローンチ。
数々のプロトタイピングツールを試しているうちに、エンジニアの方なら誰しもが思ったこと…それは 「ここまで出来るんならコード生成してよ……」 ってことなんじゃないでしょうか？ プロトタイピングツール？NO！新しいデザインツールだ。 たぶんこのAnimaが開発中の「Sketch to Code」という新しいツールは今までのプロトタイピングツールを利用した工程に縛られているとピンと来ないツールなのではないでしょうか？ 今まではデザイナーがどんなに頑張ってアニメーションを作っても、それをエンジニアが再び頑張って実装する…という二重構造だったわけですが、これからはAnima上でレイアウトやアニメーションがバッチリ決まれば、エンジニアはよしなに生成されたコードを利用すればいいということに。 とりあえずデモを見てください。 Auto Layoutからアニメーションまで。 リアルタイムプレビューしながらA
iOS7のガイドラインにそって作成された300個のフリーアイコンセット「RetinaIcon 300 Free Icons」
フラットテイストのデザインが採用されたiOS7。そのデザインに合うように、webサイトやアプリケーションデザインもテイストを合わせて制作することが多くなってきていると思います。今回はそんな時に便利に活用できる、iOS7のガイドラインにそって作成された300個のフリーアイコンセット「RetinaIcon 300 Free Icons」を紹介します。 300個という豊富な種類が魅力的な、アウトラインタイプのアイコンとなっています。 詳しくは以下 メールやファイル、adobeアプリケーション、天気やSNSなどの定番として利用できる種類はもちろん、フェイスやファッションアイテム、フード、宇宙、スポーツといった個性的なジャンルもアイコン化されています。種類が300個も揃っているのが嬉しいですね。非常にシンプルなので、iOS7だけでなく、他のバージョンやイメージのデザインにも当てはめやすいのではないで
フラットからリアルまで さまざまな種類のフリーアイコン「Free and Fresh icons in PSD For Web Designers5」
TOP > Design > フラットからリアルまで さまざまな種類のフリーアイコン「Free and Fresh icons in PSD For Web Designers5」 さまざまな種類が公開・配布されているフリーのアイコン。すでにいくつも、デザイン素材としてストックされている方も多いのではないでしょうか？今回はそんなコレクションに新たに加えたいフリーアイコンセットまとめ「Free and Fresh icons in PSD For Web Designers5」を紹介したいと思います。 Free PSD Academic Icon Set | Free PSD Files フラットからリアルまで、いろんな種類のアイコンが紹介されています。気になったものをピックアップしましたので、下記よりご覧ください。 詳しくは以下 Dribbble – Food Icons – FR
モバイルUIのデザインに役に立つUIパターンギャラリー集17選 - showrtpath - iOSブラウザ開発日記
2013-12-23 モバイルUIのデザインに役に立つUIパターンギャラリー集17選 アプリの開発の時にUIのデザインに悩みますよね。 そんな時、モバイルUIのパターンギャラリー集が役に立ちます。 そのギャラリーサイトのサイトを集めてみました。 スクリーンショットを集めたものと、デザイナーの作品のものがあります。 Showrtpathブラウザを開発していた時はdribbbleをよく見ていました。 Pttrns - Mobile User Interface Patterns 優れたiPhoneサイトデザイン集 - iPhoneデザインボックス Mobile Patterns lovely ui Inspired UI - Mobile Apps Design Patterns [iPhone] Mobile Awesomeness Meerli · Featured Android Nic
ウェブデザインとスーパーのチラシの共通点
Facebookのタイムラインに「日本のウェブデザインはなぜこんなにも世界と違うのか？」という記事の紹介が流れて来たので読んでみたが、これはウェブデザインに限った話ではないと思う。典型的なのがスーパーのチラシ（下の写真はここからの引用）。 日本のスーパーのチラシは、「これでもか」とばかりに情報を詰め込む上に、「安売り情報＝赤」という王道を決して踏み外すことはないため、どのスーパーのチラシもこんなデザインになる。情報量だけはすごいが、「エレガントなデザイン」とは正反対のところにある。 米国でも、一昔前までは似た様な状況だったが、ここ数年は差別化が進み、少しこだわったスーパーのチラシのデザインはこんな感じだ。 明らかにプロのデザイナーの手が入っているし、「食欲をそそる」という明確なデザイン・ゴールが見てとれる。 どちらが正しいという話ではないが、米国の一部のスーパーがこんなデザインに走っている
UXArchive - Made by Waldo
Introducing Sessions: the latest product from Waldo!
iOS 7はもっさりか？比較検証してみた | TOKOROM BLOG
今回の記事はUIデザイナの Morino氏 からの寄稿です。 iOS 7が正式リリースされました。既にアップデートを行って実際に試されている方も多いと思いますが、今回はUIに大幅な変更が加えられたために、まだ操作に戸惑いのある方もいるのではないでしょうか。 特にiOS 7にしてから重く感じる、もっさりしているという意見もけっこう多いようです。iOS 7をしばらくいじってからiOS 6の端末を触ると、たしかにiOS 6の方がきびきび動いているように感じます。 今回は半透明やぼかし、視差効果などの画像エフェクトをふんだんに使用しているために画像処理の負荷が高いことも確かでしょう。しかし、全てが端末の性能のせいというわけでもないことを、今回はご紹介したいと思います。 頻繁に操作を行う以下の4つのシーンについて、ちょっとした比較検証を行いました。 ロック解除してから、ホーム画面のアイコンが全て出現
iOS 7アプリを開発するのに必携のワイヤーフレーム·iOS 7 Wireframe Kit MOONGIFT
iOS 7 Wireframe KitはCreative Commonsのオープンソース・ソフトウェアです。 iOS 7の正式リリースは間もなくと思われますが、既に新しいアプリ開発においてはiOS 7のUIを模して行われていると思われます。そんな中で必要なのがUIを決める素材集です。今回はIllustratorベースのiOS 7 Wireframe Kitを紹介します。 こちらがファイル一覧。Illustrator、PDF、PNG、Omni Graffle、Sketch用のファイルとなっています。 その内容。iOS 7らしい雰囲気のコンポーネントが多数作成されています。 こちらはIllustrator版。 iOS 7 Wireframe Kitではデフォルトのオブジェクトをデザインしていますので、そういったパーツを組み合わせて作るアプリに対しては有効ではないでしょうか。細かくカスタマイズす
【厳選】日本の全iOSプログラマに捧ぐ！iPhoneアプリ制作に参考になりすぎるデザインリンク集15選 | DX.univ
iOSアプリ開発担当の菅原です。 iPhoneやiPadのア[...]【厳選】日本の全iOSプログラマに捧ぐ！iPhoneアプリ制作に参考になりすぎるデザインリンク集15選 by Yu Sugawara in Design · Mobile — 2013/07/18 iOSアプリ開発担当の菅原です。 iPhoneやiPadのアプリ開発はすべて一人で販売するところまで持っていけるのが魅力の1つです。 アプリ開発作業を大きく分類しますと プログラム デザイン 販売 にわかれます。販売に関してはAppStoreがあるので、心配はありません。残りのプログラムとデザインですが、なかなか両方を得意にするというのが難しいと思います。僕はプログラムは出来るのですがデザインがからっきしダメです。 今日はそういったデザインが苦手なプログラマ向けに参考になるデザインリンク集をご紹介いたします。個人のアプリ開
UIデザインのアニメーションまで共有できるモック作成ツールまとめ | Goodpatch Blog
先日、Goodpatch代表の土屋がWebSig会議というイベントで講演をしました。講演は「ハートに響くUIを生み出すためのデザインプロセス」というタイトルで行われ、起業までのストーリー、GoodpatchのUI設計プロセスなどについて話しました。講演内容は↓のslideshareを参照してください。 その講演の中でGoodpatchはデザインする際にプロトタイプを作成していると話しました。以前にMEMOPATCHでもインタラクションや導線の動きを伝える上でプロトタイプ作成が重要という趣旨の記事をアップしています。 （参考: これからのUIデザインのために、デザインカンプをやめてプロトタイプを作ろう（前編）, （後編）） プロトタイプ作成というとHTML, CSS, JavaScriptで実装する方法がメジャーかと思いますが、これだとリソースをかなり割くことになってしまいます。そこで今回は
【アプリ開発のお手本に】iOS 7の設計においてアップルが大切にした4つのポイント | TOKOROM BLOG
今回の記事はUIデザイナの Morino氏 からの寄稿です 前回 はiOS 7紹介ビデオの中のジョナサン・アイブ氏のパートをご紹介しました。 今回は、その中でも特に重要と感じたいくつかのフレーズをピックアップして深堀りしてみたいと思います。 “True simplicity” iOS 7から話題の"フラットデザイン"が採用されて、画面デザインは大分シンプルな外観になりました。 使う色の数は限定され、簡単明瞭なラインやシルエットがほとんどのデザインを占めています。 iOS 6まで採用されていたSkeuomorphism（装飾的・リアルな外観）は排除され、立体的で質感を感じるデザインから、平面的で形やテキストの意味性をストレートに伝えるデザインに変わりました。 ただ、“Simplicity"という言葉は、単に外観を表すものとして使われているわけではありません。 「複雑さに秩序をもたらす」という
UIにおけるシンプルの価値と上岡龍太郎
フラットデザインですね。 iOS7のUIの画面キャプチャーを見ながら、Androidが前からやっていたよね、とかWindows8もその流れだよね。といった話題に花を咲かせたここ数日でした。 やっぱりシンプルを極めるとこうなるのかしらね。もっこりしたUIとか影とか立体感がシンプルじゃないよね。 的な話には「画面キャプチャーだけでいろいろ言っている」という違和感を超え、何かしっくりこない気分にさせられていたものです。 そんなときわたしが思い起こしたのは、桂三枝（現：六代 桂文枝）のことでした。 桂三枝といえば「いらっしゃ〜い」です。 「いらっしゃ〜い」 字面だけみると、ただの挨拶というか、だからどうしたのか。と、疑問さえ湧いてくる。 だがしかし、この言葉が三枝から繰り出された瞬間、人は笑うのです。 たぶん、三枝といらっしゃ〜いの歴史を知らない子供でも、笑うでしょう。 そして三枝以外の他のだれか
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Flipsblog.jp
新着記事
ウェブ初心者も安心して作成できる、無料HTMLテンプレート素材24個まとめ - PhotoshopVIP
新着記事
新着記事
デザイン | Android Developers
