よくわかるマテリアルデザインの設計コンセプト | fladdict
iPhoneとAndroidではiPhoneのほうが良くできているが、iOSのフラットデザインとAndroidのマテリアルデザインでは後者の設計が優れている。マテリアルデザインは、デザインとエンジニアリングが高いレベルで融合していて、ロジカルで非常に美しい。 以下、自分の理解をまとめたメモ。 紙とインク マテリアルデザインは「ペーパー」と「インク」のメタファーでできている。 ペーパーの特徴 バーやボタンといった画面上のUIコンポーネントは、バーチャルな紙でできたカードと考える。また、このペーパーは1dpの厚さを持っている。 ペーパーは純白の矩形、あるいはシンプルな円形である。三角や星型といった複雑な形はとらない。そのような複雑な形状や模様はインクが担当する。 現実とことなり、このペーパーは自由に伸縮することができる。 マテリアルデザインにおけるレイアウトは、複数のペーパーを並べたり、重ねた
UIデザイン・プロトタイピングのセミナー交流会に行ってきました #popapp - ぬんびりぶろぐ
2014年9月10日、渋谷ヒカリエのDeNAさんで開催された UIデザイン・プロトタイピングのセミナー交流会 行ってきました 100名定員のところ268名参加希望が来ちゃうという人気ぶり！ はじめて見たときに、iPhoneだけでプロトタイピングできちゃうスゴイ！！と衝撃だったプロトタイピング用アプリ「POP」を開発したBenさんのお話と、あの凄腕デザイナーでデベロッパーな深津さん(@fladdict)が登壇するのだから、この人気も納得です スケジュール 17:30 開場 18:00 – 18:10 オープニングトーク 18:10 – 18:40 POPとUS式のアプリデザインについて by Ben Lin 18:40 – 19:25 ペーパープロトタイピング入門 by fladdict 19:25 – 19:40 会社および事例説明 by DeNA 19:40 – 21:00 交流会 PO
デザイナー向け！iPhone6対応について
（追記 140919 11:00)iPhone 6 Plusを入手しました 特に対応してないアプリで遊んでみても画像の劣化は問題にならないレベルです（主観だけど） （追記 140920 15:00)iPhone 6でのアプリUIについて別記事たてました みなのもの落ち着け！ iPhone6/6+の発売がいよいよ明日となりました！ 二年ぶりとなる画面サイズの変更に加えて@3xの台頭などもあるので、 慌てている・不安なデザイナー同志に向けて気をつける情報をまとめてみました。 画面解像度 アイコン・スプラッシュ レイアウト対応について ひとまず気にするのはこの辺りの情報！ あとはおまけで便利そうなリンクも載せました これを読んで、幾分かは晴れやかな気持ちで明日を迎えましょう。 それにしても時代はレスポンシブです。 やれやれだぜ。 基本的な情報 画面解像度はこうなってます 端末 解像度 インチ 書
iPhone 6 Screens Demystified | PaintCode
Few days ago, Apple introduced iPhone 6 Plus. The new iPhone substantially changes the way graphics are rendered on screen. We've made an infographic to demystify this. 320 × 480 375 × 667 414 × 736 320 × 480 750 × 1334 1242 × 2208 1080 × 1920 3.5″ 4.7″ 5.5″ iPhone 6 Plus has screen with lower pixel resolution than the image rendered in previous step. Before the image can be displayed on the scree
『デザインは8の倍数でできている』
1 pixel｜サイバーエージェント公式クリエイターズブログ サイバーエージェントのクリエイターの取り組みを紹介するオフィシャルブログです。最新技術への挑戦やサービス誕生の裏話、勉強会やイベントのレポートなどCAクリエイターの情報が満載です。 はじめまして。 mama&crowdのデザイナー、長谷川彰之介です。 今回は、WEBサイトの「余白」や「ブロックサイズ」「WEBサイトの横幅」に対して 「最適な値は存在するのか？」 について考えてみたいと思います。 少々長いですが、お付き合いのほどよろしくお願いします。 ボックスサイズとは、「ヘッダー」「コンテンツ」「ナビゲーション」などの ひとつひとつの固まりの大きさ（サイズ）を指します。 【第１部】8の倍数 WEBサイトのUIをデザインしていて悩まされるのが「余白」です。 「ここは3px…いや4pxか。もっと空けたら見やすくなるかもしれない。6p
モバイル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
iPhone.design » 日本の風習を伝える100のアイコン − 完全版
『日本の風習を伝える100のアイコン』プロジェクトの完成版です。 日本固有の風習を伝えるもので、多少なりともアイコンとしての需要がありそうなものを、今まで4回に渡って配布してきました。 今回はその完成版です。 100個揃った完成版をもって5回目の配布に換えさせていただきます。 また、完成にあたってシェイプを含むpsd及びaiデータの販売を開始しました。 $5.00で販売のところを、コリスさんとのタイアップ企画として限定3日間、無料にて配布させていただきます。 データの内訳は以下の通りです。 Free Download(無料版) ・.png(32px×32px,64px×64px) ・.psd(32px×32px,64px×64px) $5.00→$0(10月17-19日のみ無料) ・.png(32px×32px,64px×64px) ・.psd(32px×32px,64p
SmartNewsのUI/UXエンジニアが語る！「iPhoneの画面サイズと室町時代の違い棚」 | Find Job ! Startup
FINDJOB! 終了のお知らせ 2023年9月29日にFINDJOB!を終了いたしました。 これまでFINDJOB!をご利用いただいた企業様、求職者様、様々なご関係者様。 大変長らくFINDJOB!をご愛顧いただき、誠にありがとうございました。 IT/Web系の仕事や求人がまだ広く普及していない頃にFind Job!をリリースしてから 約26年間、多くの方々に支えていただき、運営を続けてまいりました。 転職成功のお声、採用成功のお声など、嬉しい言葉もたくさんいただきました。 またFINDJOB!経由で入社された方が人事担当になり、 FINDJOB!を通じて、新たな人材に出会うことができたなど、 たくさんのご縁をつくることができたのではないかと思っております。 2023年9月29日をもって、FINDJOB!はその歴史の幕を下ろすこととなりましたが、 今後も、IT/Web業界やクリエイティブ
スマフォアプリの操作が気持ちいいエフェクトがたくさん！タップ操作時のエフェクトのまとめ -Tapotype
Tapotype 掲載されている各エフェクトはタップやクリック操作で、実際にアニメーションで動作します。 サイト閲覧には、Safariをオススメします。 各エフェクトはカテゴリ別にまとめられており、それぞれ詳細ページも用意されています。
PopApp Magazine - Popular Magazine
About Us Welcome to PopApp.in, your trusted source for the latest news, information, and insights. We are dedicated to delivering high-quality content that informs, engages, and entertains our diverse readership. Our MissionAt PopApp.in, our mission is clear: to provide you with accurate, unbiased, and timely news that matters. We believe in the power of information to shape perspectives, drive co
寸法と解像度のチートシート
その他の寸法 ハガキ … 148 mm × 100 mm (A6 より横が 5 ％程度短い) 名刺 … 91 mm × 55 mm (B8 より横が 1 割程度短い) レター … 279 mm × 216 mm (A4 より縦が 1 割程度短く，横が数％長い) 新聞 … 開いた状態で 813 mm × 546 mm (A1 に近いが少し小さめ) クレジットカード … 85.6 mm × 54.0 mm 磁気カード … 85.0 mm × 57.5 mm テレホンカード … 86.0 mm × 54.0 mm CD … 直径 120 mm (穴は直径 15 mm，印刷可能範囲は直径 46 〜 116 mm の範囲) 証明書の写真の寸法 パスポート … 縦 4.5 cm × 横 3.5 cm 履歴書，TOEIC … 縦 4 cm × 横 3 cm TOEFL，英検 … 縦 3 cm × 横 3
スマホサイト WEBデザイン集 AGT smartphone design gallery
スマホ向けWEBサイトデザイン集 AGT smartphone design galleryは、クオリティの高い、スマートフォン対応Webサイトを集めたギャラリーサイトです。
スマートフォン、タブレット、デスクトップのためにレイアウトの幅をどのように設計すればよいか
iPhoneやAndroidなどのスマートフォン、「新しいiPad」などのタブレット、そしてデスクトップなど、さまざまなデバイスの幅に対応させるResponsive Web Designのために、どのようにレイアウトの幅を設計し、いくつレイアウトを用意するのか3つの方法を紹介します。 各デバイスの幅は、2012年3月のデータです。 A Simple Device Diagram for Responsive Design Planning [ad#ad-2] 下記は各ポイントを意訳したものです。 キャプチャに使用している画像は元記事よりPSDファイルでダウンロードできます。 各デバイスのサイズ レイアウトを3つ レイアウトを4つ レイアウトを6つ 各デバイスのサイズ まずは、2012年3月現在の各デバイスの幅です。 ※クリックで拡大 ポイント 上段：ポートレイト（縦置き）、下段：ランドスケ
スマートフォンサイト作成の参考になるギャラリーサイトのまとめ
このブログではないですが、Google Analyticsを見るとスマートフォンからのアクセスが結構あったので、スマートフォン向けのサイトを作ってみようと思いました。 ただ、スマホ向けのサイトは作ったことがないので、まず実際に色んなサイトを見て参考にしようと思い、ギャラリーサイトを調べてみました。 国内ギャラリー まずは国内サイトです。iPhoneが中心になっています。この3つのほかにも色々ありましたが、内容的には似ているので、更新頻度や使いやすさなどを基準に選びました。 iPhoneデザインボックス 画像が大きく見やすいです。個別ページでは画像も多くPCサイトとの比較もあってとても使いやすいです。カテゴリもしっかりしています。 iPhoneデザインアーカイブ 掲載サイト数が多く、更新頻度もかなり高いです。 スマートフォンサイト集めました。 すっきりしたデザインで見やすいです。カテゴリも業
Youtubeの動画を背景に
Introduction In the ever-evolving landscape of web browsing, staying abreast of the latest technologies is crucial. HTML5, the fifth and current version of the Hypertext Markup Language, has revolutionized the way we experience the web. With its advanced features and enhanced capabilities, HTML5 has become the cornerstone of modern web development, offering a more seamless and interactive user exp
How To Enable HTML5 In Chrome | Robots.net
Introduction In the ever-evolving landscape of web browsing, staying abreast of the latest technologies is crucial. HTML5, the fifth and current version of the Hypertext Markup Language, has revolutionized the way we experience the web. With its advanced features and enhanced capabilities, HTML5 has become the cornerstone of modern web development, offering a more seamless and interactive user exp
スマフォとかミニマルデザインに特化した、これからお世話になりそうなWebデザインギャラリー - かちびと.net
Warning: Undefined array key "width" in /home/youhei0828/kachibito.net/public_html/wp-includes/media.php on line 1681 Warning: Undefined array key "height" in /home/youhei0828/kachibito.net/public_html/wp-includes/media.php on line 1682 自分の中で課題があって、その為に 必要なインスピレーションを得るため のギャラリーサイトをまとめます。いち いちブックマークから探すのが面倒に なってきたのでちょっと整理がてら記事 にします。 というわけで個人的なリンク集です。スマフォとかミニマルデザインとかのWebデザインギャラリーいろいろ。デザインギャラリーですけど、目
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
Mobile Patterns - UI UX Inspirational Gallery for iOS and Android
http://designdesigndesign.net/
