配色はセンスじゃない、UIデザインで色をかんたんにキメるメソッド｜Taiki IKEDA｜note
今日は先日勝手にリデザインしたPolipoliのデザインを使って、UIデザインを行う時に僕が普段どのように色を選択しているのかをとても正直に書いていこうと思います。僕がこれから記す方法に則って色を選べば、誰でもナウでヤングなアプリを作ることができます。 はじめるよ レイアウトに関してはイニシエよりご先祖様がお築きになられたルールに則って並べればオワ、オワリです。さっそくこのPolipoliベッチュー、タタキケンサキエディションに色をつけていきます。 1. メインカラーを選ぼうまずはじめにメインとなるカラーを決めます。Polipoliのテーマカラーはピンクなのでブラウザの検索欄に「pink flat ui design」と打ち込みます。イメージに近い色が出てきたらスポイトで吸い取りましょう。著作権にはくれぐれも注意してください責任は負いません。 Polipoliに関しては最初からメインカラー
UI Sources | Mobile Design Patterns and Interactions
If you're facing payment issues, send me an email at abhinav@uisources.com for alternative methods Real design inspirationBrowse recordings of end to end user journeys from the top grossing apps to reduce iteration cycles, gain insights, identify trends & benchmark against your competitors and industry’s standard. Stop spending time reinventing the wheelAre you and your team spending time figuring
クラウドワークスを作り変えるUXガイドライン（11ヶ条33項）の中身を初公開 - CrowdWorks Designer Blog | クラウドワークス デザイナーブログ
こんにちは、UXデザイングループのデザイナーの上田です。最近ハマってる音楽は、先日オススメしてもらって聴き始めた Little Glee Monster でして、 先月発売の「だから、ひとりじゃない。」を永遠リピートする日々です。 さて、クラウドワークスのUXデザイングループでは、仕事（発注者）と受注者のマッチングサービス「クラウドワークス」の提供すべきユーザー体験の指針として、2017年1月に“UXガイドライン”を作りました。 デザイナーイベントのUX JAM 14で、「自分たちでつくった『UXガイドライン』を片手に、クラウドワークスを作り変える」といったテーマで社外向けの発信はしており、SNSやイベントなどで一部反応は頂いていたものの、ガイドラインの内容自体は公開できてませんでした。そんな中で、もろもろ準備が整ってきたので、今回の記事では初めてその中身を公開できればと思います。 UXガ
Sketch移行とUIコンポーネント化で、良いことしかなかった話
アプリやWebのUI制作では、もうSketchに完全移行したという方も多いのではないでしょうか。VASILYで開発・運用しているファッションサービス「IQON」でも、昨年の夏頃から徐々に移行を開始し、現在はほぼすべてのUI制作をSketchで行えるようになりました。 そこで今回は、Sketch移行を進めた際の「デザインのコンポーネント化」のポイントや、その恩恵をお話したいと思います。 デザインデータの属人化、という問題IQONは2010年にサービスを開始・運用してきたため、デザインデータの量がかなり多く、最新のデータがどこにあるのか分かりづらかったり、デザインデータのつくり方が「属人化」していたことが問題となっていました。 サービスの成長にともない2015年頃から徐々にデザイナーが増えてきましたが、新しいデザイナーが入った際すんなり作業を開始することが難しかったり、急対応が必要な際に作業し
サービス設計を依頼できるUXやUIデザインの制作会社 | UXデザイン会社Standardのブログ
新規事業の立ち上げやサービスの改善の際、社内の声だけでなく外部の専門的な意見を求めるために相談できるデザイン会社を探そうとしたことはありますか？ STANDARDでは、「新規事業のアイデアはあるけど具体性が見えない」「リリースしたサービスの数字が伸びない」のような悩みをお持ちの企業に対し、UXデザインやUIデザインのサービスをご提供しており、様々な業界の企業様からお話をいただくことが多いのですが、少人数の会社故、リソースの関係で辞退させていただくことが少なくありません。 そこで今回は、同様にサービスの受託制作を中心に活動されているデザイン会社の中で、個人的につながりのある信頼がおけるデザイン会社を11社ピックアップしてご紹介させていただきます。 1. 株式会社root http://ic-root.com/ 「デザインを通じて事業成長に貢献する」というミッションをもとに、グラフィックや造形
デザイナーが伸び悩まないためのスキル18分類【基礎スキル編】 | CyberAgent Developers Blog
これらのスキルが全てパーフェクトに備わっていなければならない訳ではありません。人それぞれバラつきがあって当然です。 あくまでもデザイナーとしての成長過程で、自己理解をしながら取り組むべき課題を可視化して成長してもらうことが目的となります。 フィードバックの方法 個別のスキルの説明に入る前に、フィードバックの方法がかなり重要なので、触れたいと思います。 9分類の中から “ 良いところ ” と “ 期待したいところ ” （指摘や注意など）を必ずセットで2〜3つづつをフィードバックします。どちらか一方のフィードバックでは、最悪なコミュニケーションになってしまうことは、想像できると思います。ここでは、個人のスキルをポジショニングして、可視化することが重要です。 例えば… 絵作りや装飾を作り込むことが得意なデザイナーが、バナーのような限られた空間でのデザインがうまく行かず苦戦するケースがあります。本
デザインの「枯れ」とコンプレクション・リダクション - note
また新しいのが出てきた「コンプレクション・リダクション」という言葉がつくられたらしい。 要は、近頃見られはじめた、最新のiOSガイドラインに適合した、見栄え上わかりやすいようなスタイルを抑制し、禁欲的で、コンテンツに基づいた構成を心がけたつくりのアプリUIのことのようだ。 グラフィックデザインを広義の概念と捉えるなら、この流れはスイス派であるとか、ミニマル、モダンな流れを推し進めただけのように思われる。ことアプリUIデザインの文脈のなかではこういった言い方ができる、ということなんだと思う。 消えかける「俺得」結論からいうと、今回は、「俺得」がどんどん消えていっているので、ちょっとさみしいという話。 「俺得」って何、という点だけど、ちょっと長い自分語りです、すみません。 紙デザインの文脈を延長すれば自動的にモダンなオンスクリーンデザインが得られた僕は、もともとはエディトリアルデザイナーだった
おすすめデザイン入門書10選 : could
たまには本もいかがですか？ セミナーやワークショップのあとに質問を受けることがありますが、「おすすめの書籍はありますか？」と聞かれることがあります。 Web には膨大な情報がありますし、英語まで手を広げると研究者による文献にもアクセスすることができます。しかし、ある特定のトピックを要所を落とさず学びたいときは書籍が便利です。 目まぐるしく状況が変わるだけでなく、デザイナーとして知っておくべき領域も広い今日のデザイン。ソフトウェアの使い方を覚えることも重要ですが、作るための考え方や伝えた方を学ぶことに多くの時間を費やしたほうが良いでしょう。自分のデザインの意図が説明できて、ようやく同僚やクライアントにデザインを理解してもらえるからです。 今回は、デザイナーとして読んでおきたいオススメの入門書を紹介。Web やアプリに特化したものではなく、デジタルプロダクトに携わるデザイナーに向いている書籍を
最前線IT企業のデザイナーたちが参考にしてきた「UI・UXの良書」とは | nanapi [ナナピ]
便利なシステムを生み出し、ユーザーの感動体験に欠かせない「UI/UX」。デザイナーとしてお勤めの方はもちろんのこと、IT業界に関わっている・関心があるなら積極的に学んでいきたい分野です。 今回話をうかがったのは、人気IT企業におつとめのデザイナーの方々。「UI/UX」について学び考える上で、おすすめの書籍を教えていただきました。 ご回答いただいた企業はこちら 1 グリー株式会社 2 GMOインターネット株式会社 3 GMOペパボ株式会社 4 ピクスタ株式会社 5 株式会社ブラケット 6 ヤフー株式会社 7 株式会社リブセンス グリー株式会社 細川菜々恵さん スマートフォン向けアプリ開発を担うスタジオ「Wright Flyer Studios」にて、Art UI UXチームのUI/UXディレクターを務める細川菜々恵さん（以下、細川さん）。UI/UXを学ぶにあたり、おすすめを教えていただきまし
![最前線IT企業のデザイナーたちが参考にしてきた「UI・UXの良書」とは | nanapi [ナナピ]](https://cdn-ak-scissors.b.st-hatena.com/image/square/6f819e6fb65420c2b090598b7c6ca5eefd67194b/height=288;version=1;width=512/https%3A%2F%2Fp.cdnanapi.com%2Fr%2F2015%2F11%2F05%2F16%2F5dd1174c-ae44-4a73-aa5b-9b981c8e5b1e.jpg)
illustratorでUIデザイン：画面遷移図作成スクリプト - Two hats
illustratorでUIデザインをし始めると便利だなーと思うところが幾つかあります。 その内、個人的に押しなのは「アートボード」です。 1つのファイルで複数の画面を作成・管理することができ、一覧性が高いのでアプリの全体を俯瞰しつつ１つ１つの画面を作成していくことができます。 但し、単に画面が並べてあるだけなので画面遷移図のような並びにできたら便利だろうなと思いついてスクリプトを作成してみました。 画面遷移図.jsx Githubにもアップしてみました。github.com 使い方 例として、画面検討するためにワイヤーフレームの画面構成図をillustratorで作ったとします。 単に作っただけだと下図のように並んでいるだけです。 1.アートボードに画面遷移図用のタグをつける 「パネル>アートボード」でアートボードパネルを開き、名前にタグを埋め込んでください。タグと言っても難しいことはあ
UIを短期間で検証するデザインスプリント | 1 pixel｜サイバーエージェント公式クリエイターズブログ
1 pixel｜サイバーエージェント公式クリエイターズブログ サイバーエージェントのクリエイターの取り組みを紹介するオフィシャルブログです。最新技術への挑戦やサービス誕生の裏話、勉強会やイベントのレポートなどCAクリエイターの情報が満載です。 はじめまして。 ディレクター、UXデザイナーをしている大塚です。 今回は、5日間でアイデアを形にし、利用者に評価してもらい検証する「デザインスプリント」というプロセスについてご紹介します。 新規サービスを立ち上げたり、新機能を検討し、延々とブレストを繰り返し、いつまでたっても話がまとまらず、ようやくかたちになったら、あまり利用されずに終わってしまうということは、想像しているより良くあることです。 新製品の70-80％が投資分が回収できないという統計もあります。また、その失敗の理由の一番が42％で、市場にニーズがなかったというものです。熱意をもって開発
デザインやレイアウトの参考になる、管理画面・ダッシュボードのデザインショーケース - NxWorld
Dribbbleで見かけたのを中心に、全体的なデザインや各要素の配置レイアウトなど参考にさせてもらおうと思いメモしていた管理画面・ダッシュボードのデザインが溜まってきたので、自分の整理も兼ねてまとめました。 管理画面やダッシュボードで重要なのは見易さや操作性の高さだと思いますが、デザインにもこだわりたいという場合にいろいろ参考になります。 紹介している中にはデザインをPSDなどの形式でデザイン素材としてダウンロードすることができるものもいくつかあり、ただデザインを見るだけでなく実際にどのようなレイヤースタイルで作成されているかを見たり、それらをベースに自分好みの見栄えに変更することも可能です。 紹介しているデザインでダウンロードできるものを使用する際は、ライセンス等は各自で再度確認してください。
Android版「マネーフォワード」をマテリアルデザイン対応したときのあれこれ - Money Forward Developers Blog
エンジニアの黒田です。 この度Android版「マネーフォワード」アプリをマテリアルデザインにフルリニューアルしました。 そしてなんと！！！ おかげさまでGooglePlayの「2014年ベストアプリ」に選出いただきました！ GooglePlay 2014年ベストアプリ アプリのDLはこちらから 家計簿マネーフォワード【投資・資産管理】 この記事ではマテリアルデザイン対応するにあたり、考えたことや実際に書いたコード、使ったツールなどあれこれと書いてみたいと思います。 マテリアルデザインとは マテリアルデザインとはGoogleが発表した新たなデザインガイドラインです。 モバイルに限らず、AndroidWearやAndroidTVなど様々なデバイスでもユーザーに対して同じ体験を提供することを目的としています。 マテリアルデザインに関する細かい説明は割愛しますが、GoogleMapやGMailな
「コード汚くてもデザインが見えればいいじゃん」への返答
なぜコードが綺麗じゃないといけないの？という質問をごく一部の方、特にデザイナーさんから受けることがあるので（半分くらいの人はネタで言ってますが）、自分なりの意見をまとめたいと思う。勉強不足で浅い感あるので、偉い人にご指摘いただけると嬉しいです。 「コード汚くてもデザインが見えればいいじゃん」の定義について 「コード汚くてもデザインが見えればいいじゃん」はかなりふわっとした印象を持つので、ここでは「コードが汚い」の定義として、以下の2つを挙げる。 メンテナンス性に欠ける （W3Cの）仕様に沿っていない なので「コード汚くてもデザインが見えればいいじゃん」というのを「メンテナンス性に欠け、仕様に沿っていなくても、デザインが見えていればいいじゃん」という意味に置き換えて話を進める。 確かに表面的な視点で見ると、エンドユーザーには関係がなさそうに見えるかもしれない。 例えばメンテナンス性の高いコー
fladdict 深津貴之氏講演会 @Samurai Startup Island
10月7日、TiltShiftGenerator などのiPhoneアプリで有名な、fladdict 深津貴之氏の講演会に行ってきました。 テーマは「使いやすいUIをつくる基本」。 聴衆の割合はエンジニア1/3、デザイナー1/3、ディレクターまたは経営者1/3でした。その場での挙手のアンケートにより「UIの手触り」「プロトタイピング」に重きをおいて話していただくことになりました。 以下、講演メモです。 確実に失敗できる10個のテクニック はじめは「こうすれば確実にプロジェクトに失敗しますよ」というお話。 裏返すと、「こうすれば成功できる10個のテクニック」ということになります。 ＜確実に失敗できる10個のテクニック＞ 1. リサーチなしにつくる そもそも需要はあるのか？競合は？技術は？ 2. 利用シーンを考えない 3. 競合製品の劣化コピーをつくる 買う理由がない、市場飽和、アップデートの
ブレインパッド社インタビュー：Rtoaster UI改善プロジェクト秘話 | Goodpatch Blog
Goodpatchは、2012年12月より、ブレインパッド社のRtoasterという「Webプラットフォーム／レコメンデーションエンジン」のUI設計、デザイン制作、フロントエンド開発に携わっています。このたびリニューアルが完了したこともあり、プロジェクト中のワークフローやユーザーインタビュー、使用したフレームワークなどについて、当時を振り返りながらお話を伺わせていただきました。 今回インタビューを受けてくださった会社 株式会社ブレインパッド ブレインパッド社は、2004年の創業以来「ビッグデータ」という言葉が世の中に広まる前から、大量データの分析を通じてクライアント企業の意思決定支援に取り組んでいます。現在、金融・小売・メーカー・サービスをはじめとする多数のクライアント企業に対し、データ分析およびその関連サービスのパイオニア企業として、分析業務支援からデータ活用のためのソリューション提供ま
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Web Fundamentals — Google Developers
Apple Design Resources
マテリアルデザインを用いたデザインリニューアル [フリル編]![マテリアルデザインを用いたデザインリニューアル [フリル編]](https://cdn-ak-scissors.b.st-hatena.com/image/square/76b9f2cd58f69ba8f3d551f88dcafb865fb05912/height=288;version=1;width=512/https%3A%2F%2Fcdn.slidesharecdn.com%2Fss_thumbnails%2Fdroidkaigi-150425032816-conversion-gate02-thumbnail.jpg%3Fwidth%3D640%26height%3D640%26fit%3Dbounds)
デザイン仕様書(ガイド) の書き方(初歩用)
