デザイナー向けに行なったHTML勉強会の資料を公開します｜sakito

2023/08/08 394 users 一環 HTML 意図 アドバイザー ChatWork株式会社

今回はChatwork株式会社のデザイナー向けに行なったHTML勉強会で使用した解説資料をお伝えします。私は3年ほど前からChatwork株式会社の開発のサポートやデザイン基盤活動のアドバイザーとして参画しており、その活動の一環で会を開催しました。 開催の意図と目的開催概要は@emimさんが、UI設計はHTMLの理解からというタ... 続きを読む

高速周回が迷わずできる！ 「ウマ娘」UI設計の根幹とは 大量の情報でも「整理とルール化」でわかりやすい画面を作る

2021/11/13 176 users 根幹 ウマ娘 整理 画面 ルール化

続きを読む

Amebaのデザインシステム「Spindle」の全貌公開 | CyberAgent Developers Blog

2021/09/17 150 users Ameba SPINDLE UX設計 実務 組織横断

メディア統括本部・技術横断室の谷です。組織横断の活動しながら、AmebaやAmebaマンガという事業に関わっています。実務としては、コード実装をメインに、UI設計やUX設計、最近ではユーザーインタビュー等のリサーチ業務をおこなっています。 この記事では私が立ち上げから2年くらいかけて関わってきたAmebaのデザインシ... 続きを読む

Twitterにはリプライ欄を返信ではなく『コメント欄』と思っている人間がいる説「ツイッターへのコメント欄は自分のツイートなんだよ」 - Togetter

2021/09/04 194 users Togetter Twitter リプライ欄 見解 ツイッター

Melville @MelvilleTw Twitterにはリプライ欄をリプライ欄だと思っている人間と、リプライ欄をコメント欄だと思っている人間がいることを理解しなければならない 2021-09-03 08:47:55 Melville @MelvilleTw これに対する僕の見解ですが、機能に対する理解が人によって違うのはUI設計が悪いです(つまり悪いのはTwitter) ... 続きを読む

フロントエンドエンジニアがUI設計〜実装で考えていること - Medley Developer Blog

2019/03/27 111 users 実装 フロントエンドエンジニア TechLunch 大岡 内容

おはこんばんちは、開発本部エンジニアの大岡です。 先日、TechLunchという社内勉強会で「フロントエンジニアがUI設計〜実装で考えていること」という内容で発表しました。UI設計から実装の細かい話ではなくどういう気持ちで望んでるかという話で、基本的なことしか書いていませんが紹介させていただければと思います。 ... 続きを読む

モバイルアプリのUI設計に大切な、7つの基本アニメーションまとめ - PhotoshopVIP

2016/03/21 639 users PhotoshopVIP モバイルアプリ アニメーション

「良いデザインは明きらかで、偉大なデザインは目に見えない。（英: Good design is obvious and great design is invisible.）」ということばを聞いたことがあるかもしれませんが、モバイルアプリの開発にアニメーションを利用するときも、同じ基本原則が適用できます。 うまく適用されたアニメーションは、ユーザーフレンドリーで魅力的にアプリを仕上げるだけでなく、... 続きを読む

こんなやり方があったとは！IllustratorやSketchでWebデザインをはじめる前に必ず読んでおきたい -ベクターデータの教科書 | コリス

2015/06/03 175 users ベクターデータ コリス Illustra Sketch SVG

最近のWebデザインに、ベクターデータの存在は欠かせないものになってきました。 アイコンやロゴなどをSVGで使用したり、Webページやアプリのデザイン・UI設計といった制作のワークフローをベクターで作業している人も増えてきました。 今までPhotoshopでデザインをしていた人には、IllustratorやSketchを使うとそんな事もできるのか！ と目からウロコかもしれません。 Illustra... 続きを読む

ユーザーインターフェースの質を高める手法「ユーザーはヨッパライ法」とは - GIGAZINE

2014/04/30 142 users GIGAZINE ユーザーインターフェース ウェブページ

PCを操作するキーボードやタッチパネル、自動車を運転する時のハンドルやペダル類、あるいはウェブページの操作画面など、ユーザーが何かを操作したり情報をやりとりする際に触れる部分は総称してユーザインタフェース(UI)と呼ばれており、その仕上がり具合によっては製品の評価が大きく左右されることもあります。製品企画をおこなう際には重要な項目の1つとなっているUI設計ですが、特にウェブサイトにおけるUI品質を... 続きを読む

iOSヒューマンインターフェイスガイドライン: UI設計の基本事項

2013/10/03 579 users iOSヒューマンインターフェイスガイドライン 基本事項

続きを読む

クックパッドのUI設計の秘訣は仮説思考にあった！ - UX-design

2013/04/11 311 users 吉日 クックパッド Ruby 仮説思考 UIデザイナー

2013-04-11 クックパッドのUI設計の秘訣は仮説思考にあった！ クックパッドと言えばRubyの匠として有名ですが、どうやらUX / UI に関してもめちゃくちゃ力を入れているようで、「こりゃ調べるっきゃねぇ！」と思い立ったが吉日。ググってるとこんな記事（【インタビュー】クックパッドのUIデザイナー：「エンジニアの仕事が0を1にする仕事なら、デザインは1を100にする仕事 」）に出会うことが... 続きを読む

Webとは一味違うスマホアプリの動的UI設計は、「脱・ワイヤーフレーム思考」で【連載:えふしん⑫】 - エンジニアtype

2013/03/01 120 users えふしん エンジニアtype 連載 web

「取り扱う情報量が多いものをどう整理するか？」ということを考えると、確かにFacebookをマネするのは合理的だ。しかし、なぜか“流行っているから使ってみました”感は否めない。 もし、そのUIデザインをマネする場合は、コンテンツの粒度や理由が、元の情報構造に合ってないと、サイズの合わないスーツを着ているようにどこか気持ちが悪いものに感じる。 「えっ、そのUIを採用する理由ってあるの？」と違和感を感... 続きを読む

主要SNS網羅。カスタマイズ、UI設計の参考に。画面サイズ早見表

2013/01/09 157 users カスタマイズ 参考 Twitter Facebook ブランド

Facebook、Twitterなどソーシャルメディアでは個人やブランドで開設したページのデザインを多少カスタマイズできます。 可能な限り、イメージに合うものにしたいところ。 でも、サービスごとにプロフィール画像やカバー画像のサイズが違ったりして、いちいち調べたりするわけです。 そんなときに、このチートシートは活躍しそう。 と思ったけど、むしろUIデザイナーの参考になる！？ 次のソーシャルメディア... 続きを読む

スマートフォンアプリやスマホサイトのUI設計をする際に参考になる記事まとめ7つ - W3Q

2012/03/23 176 users W3Q 参考 スマートフォンアプリ スマホサイト

【スマートフォンのユーザビリティチェックリスト】 1.小さくし過ぎない、詰め込み過ぎない 2.バラつきを無くす 3.タップしたオブジェクトは反応させる 4.画面遷移アニメーションを設定する 5.画像の解像度はきちんと合わせる 6.実装側でもデザインする 7.ローディング中も画面操作できるようにする 8.真っ白なローディング画面を避ける 9.更新頻度の低いコンテンツはローカルで保持する 続きを読む

エンジニアにもわかる「ユーザーインターフェース設計」 (Yahoo! JAPAN Tech Blog)

2009/04/06 779 users エンジニア みなさま ヒント Yahoo 設計

はじめに 島津悠樹と申します。Yahoo! JAPANのソーシャルメディア系サービスの開発・ユーザーインターフェース（以下UI）設計を担当しています。私からは「エンジニアにもわかる『ユーザーインターフェース設計』」と題し、エンジニアのみなさまに考え方のヒントとなるようなネタをお届けします。 エンジニアの方々にとって、UI設計は、おもしろそう、けれど、どこかとっつきにくい……、そんな印象を持っておら... 続きを読む

ウノウラボ Unoh Labs: 「視線を導く」方法あれこれ

2007/09/07 290 users ウノウラボ yamazaki Unoh Labs 視線 ユーザ

yamazakiです。毎度毎度技術系なこのウノウラボには馴染まない話題を振りまいているわけですが、さてはてどの程度お役に立てているものか…。 今回のテーマは「視線」です。例えばWebサイトは「見てもらう」ことが大事ですし、また、UI設計の場面などでも、「視線をうまく導いてやる」のは使い勝手をよくする上でも大切なことだと思います。といったわけで、ユーザの視線をうまく捕まえてみたり導いてみたりする上で... 続きを読む

ソシオメディア | UIデザインパターン

2007/05/28 1721 users ソシオメディア ベストプラクティス ユーザビリティ ノウハウ

ソシオメディアでは、これまでのUI設計・評価・標準化サービスの経験に基づき、様々なUIデザインのベストプラクティスをパターン化しています。各種アプリケーションのUI設計効率とユーザビリティの向上に役立つノウハウとして、その一部を公開していきます。 続きを読む

FPN-団塊〜シニア層向けのWeb設計　やっちゃいけない10のＵＩ

2006/11/16 313 users Tips クレーム ユーザ 中高年層 講師

■ネットとライフスタイル 団塊〜シニア層向けのWeb設計　やっちゃいけない10のＵＩ 2006-11-17 8:10:00 by wa-ren 一時期パソコン教室の講師をやっていたことによる経験と、昨今Webサービス運用にあたって中高年層からのクレームなどを自分なりにまとめた結果として、50代以上のユーザに対するWebサービス＆PCアプリケーションのUI設計における以下10のTIPSを公開してみた... 続きを読む