2019/04/18に株式会社gumi様で行ったデザイン講義のスライドです。 デザインとは何か?デザイナーは何を考えてデザインを作っているのか? という話から、実際にデザインを評価・検討するための言葉を紹介しています。
Get inspired by the work of millions of top-rated designers & agencies around the world.
僕の同僚のデザイナーはデザインツールにSketchを使っている。デザインは区切りのいいところまで出来ると保存してDropboxで共有してくれる。最近ではGitHubでSketchファイルを管理することも試しているようだ。GitHubで管理することで過去に遡ったり、ほかの人の作業をマージできたりする。ただ、Sketchファイルはプログラムのソースコードのようなテキストファイルではなくバイナリファイルだ。この違いでGitまたはGitHubの便利なものの多くが使えていないんじゃないか。 先日Sketchファイルをテキストファイル(JSON)として管理できるツールを公開したので、どういうモチベーションで作っているのか書いてみようと思う。ツールはまだ完璧ではないが、ぜひ使って意見をもらえたらと…思う 🙇🏻 テキストファイルになるとできることあぁ、デザイン全体のボーダーの色が淡くなったのいつだっけ
インタビューUX MILK編集部、編集スタッフの藤井です。 UXデザインの現場に突撃取材するUX MILKのインタビューコーナー、今回は株式会社クックパッドの倉光さんにお話を聞いてきました! クックパッドではどんなUXデザインを実践しているのかお伺いしたところ、そもそもクックパッドのサービス開発現場では「UX」という用語はあまり聞こえてこないとのこと…! その理由とは…!? 学生の方にもわかりやすくお仕事内容を説明いただいたので、ぜひ初心者の方にも読んでいただきたい内容となっています。それでは、早速インタビューをどうぞ。 倉光 美和(くらみつ みわ) 福岡県生まれ・デザイナー。家庭用ゲーム業界でゲームのUIデザインを経て、2015年にクックパッドへ入社。現在は主に iOS/Android アプリの開発・改善を手がけるほか、グループ会社のサービスデザイン組織のサポートなども。人間中心設計推進
こんにちは。デザイナーの遠藤です。 私は今クックパッドiOS/Androidアプリのデザインを担当しています。 みなさんは、既存の機能を別のプラットフォームに追加する際に、あまり考えずにそのまま追加してしまい、後で後悔したことはないでしょうか?今回は、web版にある機能「料理の基本」をクックパッドアプリへ追加した時のことを交えて、より良いデザインにするために大切にしたいと思っていることをご紹介します。 料理の基本について レシピをみて料理を作っている際に、「あれ、半月切りって何だっけ?」「水にさらすってどれだけやればいいんだろう」のような、基本的なことさえわからず手が止まってしまったことはありませんか?クックパッドでは、そんな方のために料理の基本を提供しています。今回私は、この機能をiOS/Androidアプリのレシピページに追加する際、デザインを担当しました。 この機能の使い方は、レシピ
<追記>オリジナルのデザインスプリント文献翻訳はじめました</追記> THE GUILDのメンバーで、Google主催のプロトタイピングのワークショップ「デザインスプリント」に参加してくるなど。ご招待いただき多謝でございます。 デザインスプリントとは? デザインスプリントはグーグルによるデザイン教育メソッドとそのワークショップ。数時間から数日で一気に籠って、商品のコンセプトデザインやプロトタピングを仕上げてしまう高速なデザイン手法です。Googleのベンチャー機関Google Venturesがよく、投資先に行っているものです。 導入事例としては、最近に日本にも上陸したブルーボトルコーヒーのサイトブランディングで行われたのが有名でしょうか。GoogleX内部でも頻繁に行われているようです。本来は5日間でやるこのデザインスプリント、今回は入門編ということで圧縮して2時間で1つの企画を考えます
クックパッド検索・編成部の須藤耕平です。 昨年の夏に担当した、PCサイトのトップページリニューアルに引き続き、今年の2月にスマートフォンサイトのトップページをリニューアルしました。 前バージョンのスマートフォンサイトは、設計時から約1年半が経過していたため、コンテンツが増えた現在では全体的にかなり煩雑になっていたこと、また、PCサイトでの成功事例をスマートフォンサイトにも取り込むことを主眼として取り組んだリニューアルでした。 本エントリーでは、今回のリニューアルにあたって、主にデザイン的な面で工夫した点、及び、それにまつわる苦労話を、具体的な事例と合わせて紹介したいと思います。 PC版をそのまま移植したらものスゴイ長いページになった 今回のケースでは前述のPCの事例が先行してあり、結果も概ね良好であったため、当初は特にコンテンツを絞らず、PC版とほぼ同内容を移植する形で進めていたのですが、
It is much easier to criticize somebody else’s work than to create something cool yourself. But if you apply a systematic approach to criticizing, make a numbered list and prepare illustrations, it will be regarded as a fully-fledged analysis! In my opinion, icon design is undergoing a transitional period. On the one hand, screen resolutions are increasing, hence enhancing icons. On the other hand
はじめに こんにちは、Python界の情弱です。もうかれこれ5年くらい「僕にウェブデザインのセンスがあったら、いやせめてデザインのセンスがあったらどんなによかったことだろう」と思っていたわけですが、半ば諦めていました。しかし先日同僚の@kotarokパイセンに勧められるがままに「ノンデザイナーズ・デザインブック」を読んだら、これが素晴らしい書籍で、もう一度僕にやれば出来るかもと思わせてくれたわけです。 ノンデザイナーズ・デザインブック [フルカラー新装増補版] 作者: Robin Williams,吉川典秀出版社/メーカー: 毎日コミュニケーションズ発売日: 2008/11/19メディア: 単行本(ソフトカバー)購入: 58人 クリック: 1,019回この商品を含むブログ (102件) を見る 本書が良いのは、多くのデザイン例があり、それも原則の適用後だけではなく、その前後でどれだけデザイ
「Download button」「CSS button」「Music Player」など、テキストボックスに欲しいユーザーインターフェースパーツを記入するだけで、総合計2万個以上のパーツの中から欲しいものを検索してきてくれるのが「UICloud」です。 UICloud | User Interface Design Search Engine, UI Elements, GUI Design, Free Downloads http://ui-cloud.com/ トップページのテキストボックスに探したいパーツの名称を記入して「Search」ボタンを押します。今回は「Download button」で探してみました。 すると検索結果一覧が表示されます。色んなダウンロードボタンがずらり。 気になったものをクリックします。 すると、大きめサイズのイメージが表示されます。 画面右端には詳細情報
iPhoneアプリケーションプログラミング ガイド iPhone 2010-06-14 Apple Inc. © 2010 Apple Inc. All rights reserved. 本書の一部あるいは全部を Apple Inc. から 書面による事前の許諾を得ることなく複写 複製(コピー)することを禁じます。ま た、製品に付属のソフトウェアは同梱のソ フトウェア使用許諾契約書に記載の条件の もとでお使いください。書類を個人で使用 する場合に限り 1 台のコンピュータに保管 すること、またその書類にアップルの著作 権表示が含まれる限り、個人的な利用を目 的に書類を複製することを認めます。 Apple ロゴは、米国その他の国で登録され た Apple Inc. の商標です。 キーボードから入力可能な Apple ロゴにつ いても、これを Apple Inc. からの書面によ る事前の許
iOSヒューマンインターフェイスガイドラ イン iPhone > User Experience 2011-03-23 Apple Inc. © 2011 Apple Inc. All rights reserved. 本書の一部あるいは全部を Apple Inc. から 書面による事前の許諾を得ることなく複写 複製(コピー)することを禁じます。ま た、製品に付属のソフトウェアは同梱のソ フトウェア使用許諾契約書に記載の条件の もとでお使いください。書類を個人で使用 する場合に限り 1 台のコンピュータに保管 すること、またその書類にアップルの著作 権表示が含まれる限り、個人的な利用を目 的に書類を複製することを認めます。 Apple ロゴは、米国その他の国で登録され た Apple Inc. の商標です。 キーボードから入力可能な Apple ロゴにつ いても、これを Apple In
We Who Value Simplicity Have Built Incomprehensible Machines 8086のAAA命令っちゅうやつは、まあ昔はよかったんや。1970年代は、二進化十進数、つまり一バイトで二桁を表す必要がある時代やった。BCDって何がそんなにええんや? おっきな数字が、マルチバイトの掛け算とか割り算とかせえへんでもカンタンに表示できるんや。加算した後はASCII化(ASCII Adjust After Addition)やからAAAっちゅうわけで、x86ハードウェアに三十年以上前から居座っとる。そこらにあるi7プロセッサーは全部、AAAをマイクロコードでエミュレートしとる。 Cライブラリ関数のmemcpyっちゅうやつも、まあ昔はよかったんや。memmoveはそこそこ早くて、もうちょいと器用なやっちゃ。コピー元とコピー先がオーバーラップする場合でもちゃん
iPhoneアプリの良いアイデアが出たので、これから作り始めようというところである。 さて、iPhoneアプリ開発童貞ってわけではないが、今までただ闇雲に作っていた感があるので、 実際にXcodeを起動してコードを書き始める前の設計をどうしていこうかと考えている。 ソフトウェアの作成はじめてではもちろん無いのでだいたい勝手は分かるものの、 iPhone特有の設計思考が必要な気がして、文献を漁っている。 ところが、世に出回っているiPhoneアプリ本にはUIKitをいじくるだけの解説ばかりではないか! で、つまるところ設計について有益だと思えたのは以下3つの文献だった。 「iOSアプリケーションプログラミングガイド」Appleのサイトからダウンロードできる 「iPhoneアプリ設計の極意 - 思わずタップしたくなるアプリのデザイン」のfladdictさんの章 「iOS開発におけるパターンによ
JDK6では、一部の非ポータブルなcom.sun.* APIを使っていると次のような警告が出る。 /home/kohsuke/ws/hudson/hudson/main/core/src/main/java/hudson/security/LDAPSecurityRealm.java:26: warning: com.sun.jndi.ldap.LdapCtxFactory is Sun proprietary API and may be removed in a future release import com.sun.jndi.ldap.LdapCtxFactory; ^ /home/kohsuke/ws/hudson/hudson/main/core/src/main/java/hudson/security/LDAPSecurityRealm.java:26: warning:
デザインムックはWEB制作のワークフローを補助するローカルツールです。スケジュール進行管理、原稿管理、テンプレートシステム、HTMLチェックといった制作上必要なフローを補助します。 HTML作成補助ではXslateという強力なテンプレートシステムを採用しているため複雑なHTMLを簡単に作成することができます。もちろん従来のDreamweaverなど使って作成することや組み合わせて使うことも可能です。 Dreamweaverをそのまま使えます! Xslateによる新しいテンプレート スケジュール進行管理機能(未実装) Wikiによる原稿管理(未実装) ZIP圧縮によるバージョン管理 TESTによるHTML品質チェック Xslateによるテンプレート Xslateを使うことによってWordpressやSmartyのような柔軟な書き方を静的ページで管理することができるようになります。 CSVを
前編ではiOS5のMobile Safariから使えるようになったHTMLやCSSの要素などについて試してみた、半分だけ紹介・解説しました。まだ前編を読んでいないという方は先に前編を読んでおくことをおすすめします。 →iOS5のMobile Safariから使えるようになったHTML5・CSSを試してみました【前編】 ざっと今回試してみたプロパティやテクニックをもう一度振り返っておくと以下のような感じです。 position:fixedを使ったタブUI overflow:scrollを1本指ですいすいスクロールさせる Web Symbols typeface CSS Only Transition Effects 新しいInput typeとネイティブっぽいselect UI Inline SVGとSVG icons 前編では最初の3つを紹介・解説したので、後編では残りの3つを紹介したいと
So I gave this talk called How GitHub Uses GitHub to Build GitHub. Someone submitted my slides to Hacker News, where it stayed at #1 for most of the day. This was pretty strange to me at first. My slides are not designed for people who didn’t see the talk in person. They’re designed to support my words, not some online audience. What’s more, many commented that they found the design of the slides
ウェブサイトを作成する際に個人的に使っているWebサービスを紹介します。幅広く35個紹介しますので、新しい発見があれば幸いです。 フォント関係 wordmark.it パソコンに入っているフォントを一覧で見ることができます。フォントサイズも調整できます。 日本語フォント252種類を表示確認できます!フォントを探すならfonthack.jp。 日本語フォントの表示が確認できます。現在252種類あります。 PXtoEM.com: PX to EM conversion made simple. ベースのサイズ(px)を決めると、em, pt, %の値が表示されます。 カラー関連 ウェブ配色ツール Ver2.0 配色ツールは色々ありますが、日本語ですし、あまり考えなくても感覚的に使えるので楽しいです。 Color Scheme Designer 3 カラーパレットジェネレーターです。海外サイトで
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く