フロントエンド開発のための Figma共創のための地域基盤としての非公式組織の形成 / Informal community as an infrastructure for co-creation
業務を効率化させるデザインシステムとは？｜Tadaki
こんにちは！アルプのデザイナーの大澤 (@Tadaki) です。 先日デジタル庁でデザインシステム勉強会の記事が公開されましたね。活用事例として私が所属するアルプでのデザインシステムについて紹介できればと思います。 アルプではサブスクリプションビジネスを行う企業向けに、今まで手作業や自社開発がスタンダードだった契約や請求の管理を SaaS として提供する Scalebase というプロダクトを開発しています。 Scalebaseの開発では、日々プロダクトチームのメンバーとデザインをすり合わせをしつつ開発を進めています。その話の中で「画面Aの保存ボタンと画面Bの保存ボタンが微妙に高さが違うのですがどちらかに統一できませんか？」といった Component レベルの調整は、最初に定義してしまい相談せずとも理解できる方がお互い楽です。 デザインシステムを運用することで、UIの考え方やルールをチー
webサイトのモックアップで意気揚々とユーザーテストした結果、白目を剥きました。テスト結果と考察、改善方法｜山崎あやな
webサイトのモックアップで意気揚々とユーザーテストした結果、白目を剥きました。テスト結果と考察、改善方法 初めまして。かけだしUIデザイナーのガラナです。プライベートでE2D3のwebサイトをデザイン中です。 【E2D3とは】Excelのデータから、インタラクティブなグラフを作成できる無料アドインソフト。有志が非営利に開発中。E2D3メンバーにより、講演会やもくもく会などのイベントも定期的に開催されている。 sketchとFlintoでwebサイトのモックアップを作成し、意気揚々とユーザーテストした結果、フルボッコになったお話。テスト結果と、考察、改良点をまとめました。 現状のサイトの構成と各要素の目標はこんな感じです。 「2. E2D3概要、3. プロダクトの一部お試し、4. プロダクト詳細」できちんとコミュニケーションが取れるかどうかが肝です。 今回は「E2D3とは何かがきちんと伝わ
noteの会社に転職したデザイナーの話。｜sawa / swnjp
こんにちは、piece of cakeデザイナーの沢登（@sawamemo）です。 前回のエントリではjoinする前でしたが、1月の頭から入社しプロジェクトに参加しています。（今ちょうど入社して1ヶ月ですね） この1ヶ月間どんなことをしていたのかザッと書き出してみようと思います。 課題の可視化弊社ではgithubのissueで課題管理しています。 noteカイゼン目安箱で頂いたご意見・フィードバックやバグの情報、などなどを全て集約して管理しています。 ただ、この方法の問題として --- ・少人数のチームでは良いが、大人数になった時にissue数がさらにカオスになる ・あとからjoinしたメンバーは過去の経緯をissueレベルで探さないとならず、これまでの経緯の学習コストが高すぎる ・今、誰が何をしていてどれくらいのリソースがあるのかがパッと見でわかりづらい ・重要な課題が埋もれ気味になり、
note ――つくる、つながる、とどける。
1203本 思想を持ったお店をつくったり、運営、デザインをしているひとやその感想などの記事をまとめるマガジンです。
UI観察 - 奥行きだけでなく”軽さ”を表現するモーションデザイン｜いちがみ
15VISION（イチゴビジョン）いちがみです。普段は主にUIデザインを行なっています。 こばかなさん（@kobaka7）の「観察とは何か？デザインにどう活きるのか？」という記事が注目を集めています。 無意識を意識化すること（そして考察や想像すること）という言葉は、日頃、マイクロインタラクションのアニメーション観察を行う上でおぼろげに意識していることが言語化されたようで爽快でした。 さて、今回はiPhoneアプリ「App Store」の「Today」コンテンツの画面遷移を取り上げます。まずは、動画をご覧ください。 この記事は下記のブログに移動しました。 https://15scope.jp/design/motion-design-tips.html
サクサク感をデザインする
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog ヤフオク!アプリ開発部の中島(@52shinNaka)です。今日はデザイナーの立場からサービスの体感速度をテーマに記事を書いていきます。 サクサク感の正体 サクサク動くサービスと聞いて、どんなサービスを思いつくでしょうか？サクサク動くを分解すると下の２要素に分かれると思います。 表示速度は、純粋にコンテンツが表示されるまでの時間、体感速度は、実際にプロダクトを触って感じられた時間の長さです。触っていて「サクサク動く！」と感じられるサービスは、上の２つの要素が満たされていることが多いです。 表示速度はサービス利益に直結する デザイナーが日々の作業の中で表示速度を意識するタイミングは少ないかもしれません。しかしグロースステージにある多
バッドデザイン賞を勝手にノミネートしてみた-2017年度版- - 酔いどれデザイン日誌 - Drunken Design Diary -
忙しい年の瀬ですが、皆さま如何お過ごしでしょうか。 さて、皆さんは「グッドデザイン賞はあるのにバッドデザイン賞が無いのはおかしい」という風に思ったことはありませんか？私は職業柄、日常生活で見かけた良いデザイン事例と悪いデザイン事例を写真に撮ってストックしているのですが、その中には「本当にこれギャグじゃないの？」というレベルのバッドデザインがあったりするんですよね。 良いものを良いと評価することも大切ですが、良くないものを無視するのは人類の進歩に大きな影を落としているような気さえします。ということで、勝手にアワード化してしまいました。2017と付いてますが、私が見つけたのが2017年だったというだけで製造年度などとの相関性はなく、特に意味はないです。あくまでジョークコンテンツとしてお楽しみください。 【追記】Twitterの方で一部画像が自分で撮影したものではないのでは？とご指摘頂きました。
【sketch】TwitterのUIトレースをして気がついた事｜Masaki
初めまして。UIデザイン勉強中のマサキ(@Masaki_4_5)です。 UIデザイン、とりわけiOS appのデザインスキルを得る一番の近道を探した結果、良いデザインから吸収するのがまず大事という事を聞きました。 このように、sketchで優れたアプリのUIトレースをし、その工程でページの遷移やそのUIになった訳を考察して行くことがスキル獲得にはもってこいらしいです。sketchさえあればお手軽ですしね。 早速Twitterのプロフィール画面とタイムラインの２画面を、Sketchを用いてトレースしてみました。Sketchを用いたトレースについてはネットで既に多く説明されていたのでつまずく事はありませんでした。 Twitterをトレースして気がついた事 左：元画像 右：トレース 1.フォントについてTwitterにはinstagramなどと同様に、和文には"Hiragino sans"、英文
22個のフォーム項目を5つに？モバイル・ウェブ制作に必要な考え方とは
Conversions@Google 2017 での「Mobile in the Future 」というルーク・ロブルースキー氏のプレゼンにすごく感銘を受けたので、ここでもシェアします。ルーク氏はモバイル・ファースト を提唱した、そう、あの人です。 ちなみに、2017年11月にダブリンで行われたイベントだそうですが、アップされてる動画の中でルークさんのプレゼンが圧倒的に再生回数が多い です。さすが。 プレゼンの内容やスライドのデザインはもちろん、Q & A まですべて素晴らしい内容でした。話も上手で出てくる情報やデータの量も半端なくて説得力があるんですよね。本当にすごい。 ところどころ彼のテクノロジーオタクっぽいところが出ているんですけど、それも含めて好きなプレゼンです。自分の考えとシンクロすることも話していて、すとんと腹落ちしました。 3つのポイント 僕がこのプレゼンを見て最も重要だと思
作家サポート機能を楽しくしました｜深津 貴之 (fladdict)
11月は、note史上最大のユニークユーザー数を記録したようです。めでたい限りです。そんなわけで11月最後(12月最初?)のカイゼン報告。 今回は数字系グロースというよりは、楽しさの質的バージョンアップと、クリエイターさんの売り上げ支援です。 サポートボタンの文言がカスタマイズできるようになりましたnote記事の文末にはサポートという、いわゆる「投げ銭」的なクリエイター支援機能があります。このサポートボタンの文言を、クリエイターが自由にカスタマイズできるようになりました！ 例えば、僕の記事のサポート文言はこんな感じなります。 皆さんがお小遣いをくれると、そのお金はnoteチームの子たちに回転しないお寿司を振舞うことに使われます。 右上のユーザーアイコン > アカウント設定 の下1/3あたりのところになります。実証実験中なのでUIは作り込んではいません。極めてシンプルです。 人はお願いすると
話題のCASHというアプリのUIデザインがめちゃよくできてる
最近メルカリとDMMのファイトがスタートして盛り上がっている即時キャッシュ化サービスですが、元祖のCASHというアプリのUIデザインがめちゃくちゃ良くできてる。ちなみにiOSアプリしか見てないけど、iOSアプリを作ってる人はとりあえずダウンロードしてみる価値あると思う。 世の中にはいろんなiOSアプリがあるんだけど、UIデザインがこれすごいわと思うものってやっぱり英語のものが多かったんだけど、日本人としては日本語メインのアプリでよく考えられているものが一番参考になるんですよね。なんといってもテキストはUIで一番多く使われている部分だし。 アプリって基本的に何度も考えて考えないとゴッチャゴッチャとボタンが増えていって、結果的になんだかスッキリしない使いづらいアプリが出来上がるんだけど、CASHのアプリはすごく良くできてる。なんというか、無駄を削ぎ落としている。 まず、デザインの色の使い分けが
短期間でUI改善の糸口を発見する！ヒューリスティック評価の手法とポイント｜Goodpatch Blog グッドパッチブログ
グッドパッチでは、これまで多くの企業の新規事業立ち上げやWebサービス、アプリのリニューアルを支援してきました。そしてその多くは数ヶ月の期間がかかり、大規模のプロジェクトでは1年を超えることもあります。実際にサービスを運営されている方からは「UI/UXが大事なのは理解しているけど、予算的にフルリニューアルは難しい」「UI/UXといっても何をしていいのかわからない」といった声をよく聞きます。 そのようなニーズにお応えして、グッドパッチでは短期間で実施できる『Quick Design Install Projects』というサービスをご提供しています。今回はその中でも最短で実施可能な「UI/UXフィードバック」でも用いているヒューリスティック評価の手法をご紹介できればと思います。サービスのUI上の課題を短期間で、かつユーザー視点で導き出し、迅速なUI改善を実現しましょう。 ヒューリスティック評
検索結果一覧のUI改善でKPIが17.5%向上した話 - CrowdWorks Designer Blog | クラウドワークス デザイナーブログ
こんにちは。デザイナーの上田です。たまにはサービスグロース系の記事を書いてみようと思います。 突然ですが、「サービス改善の一環でUI改善の施策をリリースしたけど、明らかな数字の変化が見られず、いまいち上手くいったのか上手くいかなかったのか評価がしづらい。」といった経験をお持ちではありませんか？ わたし自身は何度かそういった経験があり、UI改善が定量的な成果に結びつきづらく感じて、「UI改善の価値を主張しづらいな。」と頭を悩ましていました。 そんな中、担当したUI改善で、主要なKPIを17.5%改善することができ、デザインプロセスに汎用性を持たせられそうな感覚があったので、そういった事例を増やしていくために、今回はどんな風に設計したかプロセスを振り返ってみようと思います。 もちろんUI改善の効果は定量的な数字の変化のみで推し量れないと思ってますが、一方でUI改善で数字を伸ばせない訳ではないと
UI / UX 学びまとめ
夏、満喫してますか？ 夜は何してる？ フェス、ナイトプール、おうちでまったり、友達とビアガーデン……。ViViモデルが夏の夜にやりたいこと×メイクをまとめました。
[動画解説付き]デザイナーがUI実装時に伝えるべき5つのSketchTips！ 〜エンジニアの困っている声に応えました〜 | Nagisaのすゝめ
2017年10月11日 [動画解説付き]デザイナーがUI実装時に伝えるべき5つのSketchTips！ 〜エンジニアの困っている声に応えました〜 Sketchで困っているコトがないかエンジニアに向けた社内アンケートを実施 こんにちわ、デザイナーリーダーの川畑です。 現在NagisaのUIデザイン開発では主にデザイナーがSketchで制作し、エンジニアが参照しながら実装しています。 今回は更なるエンジニア-デザイナー間の効率良い伝達のために、Sketchを参照する上でエンジニアが困っていることをヒアリング→デザイナーチーム全員で解決策を回答したので、記事として公開したいと思います。 Sketchの基本的な操作や機能は理解しているが、もっとうまく使いこなしたいデザイナーやエンジニアの参考になれば幸いです。 こちらの困っている声に応えました Lineheightが設定されたテキストボックスのマー
![[動画解説付き]デザイナーがUI実装時に伝えるべき5つのSketchTips！ 〜エンジニアの困っている声に応えました〜 | Nagisaのすゝめ](https://cdn-ak-scissors.b.st-hatena.com/image/square/eda78adee654e21c638755de408942da82a74b9b/height=288;version=1;width=512/https%3A%2F%2Fblog.nagisa-inc.jp%2Fwp-content%2Fuploads%2F2017%2F10%2Fsketchtips-1-1024x512.png)
読みやすさのデザイン備忘録 | 深津 貴之 (fladdict) | note
noteのコア体験は、「読む楽しさ」と「書く楽しさ」だと考えています。 本来ならコア体験は、調査でしっかりと導くべきものです。しかしアカデミックなUXとは異なり、実際のスタートアップ環境では時間とリソースに限界があります。このため調べながらも、走り出さなければなりません。 まず序盤はヒューリスティック（経験）ベースのデザインを行いつつ、調査やテストが可能なところから、裏づけやチューニングを行う流れになりそうです。 以下、「読書体験」における「可読性」のパートのメモ。noteチームにとりあえず提案する予定の諸々です（現時点では個人の見解です）。基本的には「当たり前のことを、当たり前に」やる予定。「これもやっとけ」的なことがあれば、タイポグラファーの諸先輩の方々には、ぜひご意見をお伺いできればと。 書体をサンセリフ系に変えるべきか？デジタルでは、一般的にサンセリフ体の可読性は、ローマン体よりも
Googleのキーボードアプリ「Gboard」iOS版が日本語対応
Google日本法人は9月20日、日本語IME「Google日本語入力」に対応したiOS向けキーボードアプリ「Gboard」が日本語に対応したと発表した。 Google日本語入力が利用できるキーボード。アプリから直接Google検索したり、検索結果を共有したり、絵文字を入力したりできる。 例えば、チャットアプリで友人とランチの場所を相談している時に、ブラウザアプリに切り替えてお店を検索し、URLをコピーしてチャットアプリに戻る――といった手間をかけず、Gboardから簡単にお店情報を検索・共有できる。 キーボードのデザインのカスタマイズも可能だ。 関連記事 Google、iOS向け検索ボタン付きキーボード「GBoard」（まずは英語版） Googleが、iPhoneおよびiPad向けのキーボードアプリ「GBoard」を米国のApp Storeで公開した。キーボードから1タップでGoogle
iPhone Xのディスプレイにある出っ張り部分にクリエイティブな適応をみせるデベロッパーたちのアイデアが面白い
Apple Special Eventの中で発表された新型iPhoneの「iPhone X」は、これまでの端末にはなかった「出っ張り」がディスプレイ上部にあります。この出っ張り部分にはiPhone Xの最大の特徴のひとつである顔認証機能「Face ID」用のTrueDepthカメラおよび各種センサーが詰まっているのですが、アプリ開発者にとってはUIデザインの邪魔になる要素であることは確かです。しかし、多くのデベロッパーたちがiPhone Xの出っ張り部分をクリエイティブに回避するアイデアを創出しています。 Creative solutions from developers working with the iPhone X notch | 9to5Mac https://9to5mac.com/2017/09/14/creative-solutions-from-developers-w
iPhone X対応におけるデザイン上の注意ポイント | fladdict
iPhone Xが発表されたわけですが、なにこのデザイナー泣かせの変態端末。 iPhoneのUI設計者グレッグ・クリスティが追い出されて、ジョナサン・アイヴがソフトウェア統括となったのが2014年。 iOS7のフラット化あたりから、どんどんとUI設計が置いてけぼりになった感がありましたが・・・ここにきてまたデザイナー泣かせの豪速球が。 ざっくりデザインガイドラインを読んでの、気になったところメモ。 画面サイズ サイズは従来のベースであった4.7インチの375pt x 667ptから、375 x 812ptに。縦方向に145pt追加された。 想定されるインパクト 表示可能な情報量が増える 縦スクロール系コンテンツのコンバージョンが増加 スクロールで隠れるナビゲーションの必要性が低下 画面上部のボタンのコンバージョンが低下 ゲームなどの全画面イラストに、黒枠が出たり、見切れたりする グラフィッ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
