SlideShare a Scribd company logo
1 of 29
Download to read offline
ヒューマンリーダブルな  CSS記述法
(異異次元編)
HCD-‐‑‒Net認定  ⼈人間中⼼心設計専⾨門家
⽻羽⼭山  祥樹  @storywriter
1	
2016年年  5⽉月13⽇日(⾦金金)    CodeGrid四周年年記念念パーティー
本プレゼンのデモは  https://github.com/storywriter/hrcss  で公開しています
αバージョン
2	
CodeGrid4周年年、おめでとうございます!
CodeGrid  のファンなので、
この場でお話させていただけるのが、
とても嬉しいです。
3	
CSS  の管理理で困っているなら
試み:
CSSのセレクタ命名は
「⼈人間に指⽰示する」ようにつける
⽻羽⼭山  祥樹  HAYAMA  Yoshiki
v インフォメーションアーキテクト
•  使いやすいWebサイトをつくる専⾨門家
•  HCD-‐‑‒Net認定  ⼈人間中⼼心設計専⾨門家
v Web業界に20年年くらい
v 担当したWebサイトが、雑誌のWebユーザビリティランキン
グで国内トップクラスの評価を受ける  ほか実積多数
v 主な専⾨門分野
•  ユーザーエクスペリエンス、情報アーキテクチャ、
⼈人間中⼼心設計、アクセシビリティ、⼤大規模CMS、ライター
Twi$er:@storywriter	
  	
   WebSite:	
  storywriter.jp	
 4	
ユーザー⼼心理理を
つかむプロです
5	
じつは20年年来のフロントエンドエンジニア
HTML・CSS・JavaScript
1998 2002 2006 20161996 2010 20122004
情報デザイン IA ⼈人間中⼼心設計、UX
サーバーサイド
アクセシビリティ
Web担当者
⼤大規模CMS
品質管理理
ライター20年年来の
フロントエンド
エンジニア
10年年間
⼤大規模サイトの
HTML・CSS
7年年間
⼤大規模CMS
6	
CSS  は、⼤大規模な環境ほど、保守が難しい
•  数千ページ、数万ページの規模。
•  1つの  CSS  ファイルが、数千ページから参照される。
•  CSS  ファイルが散乱している。
•  何⼗十⼈人もが、つねに  HTML  をさわっている。
•  スキルレベルや状況はさまざま。
•  初学者、コードに美学のない制作者、納期優先の実装。
•  制作会社が複数いることが常時。
•  何年年間のうちに、⼈人が⼊入れ替わっていく。
•  それでも安定して運⽤用できる  CSS  の記法とは?
7	
CSS  は、⼤大規模な環境ほど、保守が難しい
スコープがないから?  簡易易な⾔言語だから?
先⼈人たちの知恵:
•  OOCSS
•  BEM
•  SMACSS
「領領域」を分けるように命名規則をつくることで、
わかりやすく管理理できるようにする記述法。
8	
それでも  CSS  はこんがらがる
<p  class=”header-‐‑‒link">
    <a  class=”header-‐‑‒link_̲_̲icon"  href="#">
        リンクテキスト</a>
</p> このコードひとまとまりで
標準のコンポーネント。
絶対に変えるな!
と、あれほど⾔言ったのに
<p  class=”header-‐‑‒link">
    <a  class=”header-‐‑‒link_̲_̲icon"  href="#">
        リンクテキスト</a>
</p>
9	
それでも  CSS  はこんがらがる
それをするのは、あなたの隣隣⼈人かもしれないが、
4ヶ⽉月後のあなた⾃自⾝身かもしれない。
<a  class=”header-‐‑‒link_̲_̲icon"  href="#”>
<p  class=”new-‐‑‒link">
セレクタ
新設しちゃえ
抜き出して
使っちゃえ
10	
それでも  CSS  はこんがらがる
結局、コードの品質とは、
制作者のモラルとプライドである。
11	
それでも  CSS  はこんがらがる
そのなかでコントロールするには、
CSS  の命名規則だけでなく、
HTML  のコンポーネント単位で管理理しないと
コードの安定した運⽤用はできない。
12	
セレクタの命名は誰のためにするのか
BEM:
セレクタは「⼈人間が読むため」に命名している。
ブラウザが読むだけなら、ランダム⽂文字列列で
<a  class=”header-‐‑‒link_̲_̲icon"  href="#”>
だって困らない。
<a  class=”wfJBaVnFSzSCYb"  href="#”>
13	
セレクタの命名は誰のためにするのか
つまり
というのは
<a  class=”header-‐‑‒link_̲_̲icon"  href="#”>
という「⼈人間への指⽰示」である。
「これはヘッダ⽤用のリンクアイコンだ」
14	
セレクタの命名は誰のためにするのか
ならば、もっと直接に、
「⼈人間への指⽰示」を
セレクタ名にすればいいのでは?
<p  class=”header-‐‑‒link_̲_̲you-‐‑‒can-‐‑‒use-‐‑‒this-‐‑‒
selector-‐‑‒just-‐‑‒only-‐‑‒in-‐‑‒header">
    <a  class=”header-‐‑‒link_̲_̲icon"  href="#">
        リンクテキスト</a>
</p>
15	
では、たとえば、こんなセレクタ命名
ルールは守られるかもだが、読みづらい。
コードにも、ユーザビリティ(とくに視認性)は重要。
16	
ここで仕様書に注⽬目
HTML5:
CSS3:
class  属性のなかは、じつはどんな値を⼊入れてもよい。
CSS  として成⽴立立しない⽂文字列列でもよい。
例例:class=“(  -‐‑‒⽇日本語  )”  も  HTML5  としては「適合」
「-‐‑‒」(半⾓角ハイフン)からはじまる⽂文字列列は不不可。
逆にいうと「-‐‑‒」からはじまる⽂文字列列は、
  CSS  として衝突するおそれがない。安⼼心。
本当にこれそのまま
HTML5仕様書:  https://www.w3.org/TR/html/dom.html#classes
CSS3仕様書:  https://www.w3.org/TR/css3-‐‑‒selectors/#lex
<p  class=”header-‐‑‒link  (  -‐‑‒ブロック  )">
    <a  class=”header-‐‑‒link_̲_̲icon  (  -‐‑‒テキスト編集の
み可  )"  href="#">
        リンクテキスト</a>
</p>
17	
こう書いたらどうか?
区切切りはいろいろ試したが「(  )」の視認性がよかった。
しかも、既存の  CSS  と共存できる。
<p  class=”header-‐‑‒link  (  -‐‑‒block  )">
    <a  class=”header-‐‑‒link_̲_̲icon  (  -‐‑‒editable  )"  
href="#">
        リンクテキスト</a>
</p>
18	
もう少し、受け⼊入れやすくした(海外にも)
くりかえすが(驚くべきことに!)
これは  HTML5  の仕様に準拠している。
<p  class=”header-‐‑‒link  (  -‐‑‒block  )">
    <a  class=”header-‐‑‒link_̲_̲icon  (  -‐‑‒editable  )"  
href="#">
        リンクテキスト</a>
</p>
19	
なんと、この書式は  jQuery  でもあつかえる
$(  ʻ‘.-‐‑‒editableʼ’  )  で参照できる。
なんと  jQuery  であつかえる。
もう驚きしかない。
<p  class=”header-‐‑‒link  (  -‐‑‒block  )">
    <a  class=”header-‐‑‒link_̲_̲icon  (  -‐‑‒editable  )"  
href="#">
        リンクテキスト</a>
</p>
20	
補⾜足:data  属性を使わず、CSS  のみで書く
data  属性を使わない。class  属性(CSS  の世界)だけ
に閉じることで、初⼼心者にも馴染みやすい。
21	
Human  Readable  CSS
この記法を、⼈人間中⼼心のコーディングということで、
Human  Readable  CSS(HRCSS)
と呼ぶことにしました。
22	
それでも、それでも  CSS  はこんがらがる
ここまでやっても、⼤大規模な運⽤用では、
すべてを無視する、
コードにこだわりのない制作者もいる。
そもそも、コードを書かずに、
⾃自然とスタイルガイドをまもった実装ができる
「しくみ(システム、ツール)」があればよい。
23	
WYSIWYG  HTML  Editor  の提供
HRCSS  に対応した  WYSIWYG  HTML  Editor  を、
HRCSS  の⽂文法とともに、オープンソースで提供。
https://github.com/storywriter/hrcss  で公開。
24	
デモ:
WYSIWYG  HTML  Editor  for
Human  Readable  CSS
25	
WYSIWYG  HTML  Editor  の提供
スタイルガイドやコーディング規約だけでは、
解釈が、どうしても制作者により跛⾏行行する。
スタイルガイドとともに、
それをラクに、確実に実装できる「しくみ」
(WYSIWYG  HTML  Editor)も提供して、
品質を担保する。
26	
試み:
CSSのセレクタ命名は
「⼈人間に指⽰示する」ようにつける
27	
⼤大規模でも保守しやすい  CSS  のために
1.  セレクタ名は⼈人間への指⽰示のために書く。
2.  セレクタのなかに、必要な情報を含める。
3.  セレクタは読みやすく、そして理理解しやすく書く。
4.  しくみ(WYSIWYG  HTML  Editor)も提供する。
28	
ありがとうございました。
⽻羽⼭山  祥樹  @storywriter
⽻羽⼭山のプレゼンのアレ          が、
    スタンプになりました!
スタンプ名:ハーミィ(CSS編)  作者名:⽻羽⼭山  祥樹
https://store.line.me/stickershop/product/1228201/ja
Web・CSSネタ
全40種類

More Related Content

What's hot

Css Architecture for the future 未来を見据えるCSS設計
Css Architecture for the future 未来を見据えるCSS設計Css Architecture for the future 未来を見据えるCSS設計
Css Architecture for the future 未来を見据えるCSS設計Horiguchi Seito
 
大規模サイトにおける本当は怖いCSSの話
大規模サイトにおける本当は怖いCSSの話大規模サイトにおける本当は怖いCSSの話
大規模サイトにおける本当は怖いCSSの話井上 誠
 
イマドキの「タグ=HTML」とスタイルシート=CSS」を知ろう
イマドキの「タグ=HTML」とスタイルシート=CSS」を知ろうイマドキの「タグ=HTML」とスタイルシート=CSS」を知ろう
イマドキの「タグ=HTML」とスタイルシート=CSS」を知ろうMori Kazue
 
今必要なCSSアーキテクチャ
今必要なCSSアーキテクチャ今必要なCSSアーキテクチャ
今必要なCSSアーキテクチャMayu Kimura
 
現場で使える効果的なHTML&CSS構造設計(Effective HTML&CSS)
現場で使える効果的なHTML&CSS構造設計(Effective HTML&CSS)現場で使える効果的なHTML&CSS構造設計(Effective HTML&CSS)
現場で使える効果的なHTML&CSS構造設計(Effective HTML&CSS)Shin Takeuchi
 
最近、実務に導入してみたフロントエンドの技術8つの良かった点と反省点
最近、実務に導入してみたフロントエンドの技術8つの良かった点と反省点最近、実務に導入してみたフロントエンドの技術8つの良かった点と反省点
最近、実務に導入してみたフロントエンドの技術8つの良かった点と反省点Horiguchi Seito
 
第10回勉強会 CSS設計について
第10回勉強会 CSS設計について第10回勉強会 CSS設計について
第10回勉強会 CSS設計についてtakumaro web
 
設計から実装まで、今すぐ始める高速化
設計から実装まで、今すぐ始める高速化設計から実装まで、今すぐ始める高速化
設計から実装まで、今すぐ始める高速化masaaki komori
 
css基本。
css基本。css基本。
css基本。web12
 
Styleguide Driven Development x CMS - MTDDC Tokyo 2015
Styleguide Driven Development x CMS - MTDDC Tokyo 2015Styleguide Driven Development x CMS - MTDDC Tokyo 2015
Styleguide Driven Development x CMS - MTDDC Tokyo 2015知己 久保
 
CSSフレームワークを使った 簡単なレスポンシブデザインの作成
CSSフレームワークを使った 簡単なレスポンシブデザインの作成CSSフレームワークを使った 簡単なレスポンシブデザインの作成
CSSフレームワークを使った 簡単なレスポンシブデザインの作成Kazuki Akiyama
 
CSS設計のお勉強
CSS設計のお勉強CSS設計のお勉強
CSS設計のお勉強MarlboroLand
 
モダンCSS設計と BEMという開発手法
モダンCSS設計と BEMという開発手法モダンCSS設計と BEMという開発手法
モダンCSS設計と BEMという開発手法Kenji Karahashi
 
Web勉強会(HTML+CSS+JS入門の入門)
Web勉強会(HTML+CSS+JS入門の入門)Web勉強会(HTML+CSS+JS入門の入門)
Web勉強会(HTML+CSS+JS入門の入門)Noriaki UCHIYAMA
 
コーディングが上達するコツ
コーディングが上達するコツコーディングが上達するコツ
コーディングが上達するコツevol-ni
 
WordPressでCSSプリプロセッサ入門
WordPressでCSSプリプロセッサ入門WordPressでCSSプリプロセッサ入門
WordPressでCSSプリプロセッサ入門Sou Lab
 
知っておきたい「Web制作イマドキの注目ポイント」
知っておきたい「Web制作イマドキの注目ポイント」知っておきたい「Web制作イマドキの注目ポイント」
知っておきたい「Web制作イマドキの注目ポイント」Mori Kazue
 
Oocssとかついでにsmacssとbemの話も
Oocssとかついでにsmacssとbemの話もOocssとかついでにsmacssとbemの話も
Oocssとかついでにsmacssとbemの話もYumi uniq Ishizaki
 
これくらいはやってほしいWebデザイン
これくらいはやってほしいWebデザインこれくらいはやってほしいWebデザイン
これくらいはやってほしいWebデザインYuya Takahashi
 

What's hot (20)

Css Architecture for the future 未来を見据えるCSS設計
Css Architecture for the future 未来を見据えるCSS設計Css Architecture for the future 未来を見据えるCSS設計
Css Architecture for the future 未来を見据えるCSS設計
 
大規模サイトにおける本当は怖いCSSの話
大規模サイトにおける本当は怖いCSSの話大規模サイトにおける本当は怖いCSSの話
大規模サイトにおける本当は怖いCSSの話
 
イマドキの「タグ=HTML」とスタイルシート=CSS」を知ろう
イマドキの「タグ=HTML」とスタイルシート=CSS」を知ろうイマドキの「タグ=HTML」とスタイルシート=CSS」を知ろう
イマドキの「タグ=HTML」とスタイルシート=CSS」を知ろう
 
今必要なCSSアーキテクチャ
今必要なCSSアーキテクチャ今必要なCSSアーキテクチャ
今必要なCSSアーキテクチャ
 
現場で使える効果的なHTML&CSS構造設計(Effective HTML&CSS)
現場で使える効果的なHTML&CSS構造設計(Effective HTML&CSS)現場で使える効果的なHTML&CSS構造設計(Effective HTML&CSS)
現場で使える効果的なHTML&CSS構造設計(Effective HTML&CSS)
 
最近、実務に導入してみたフロントエンドの技術8つの良かった点と反省点
最近、実務に導入してみたフロントエンドの技術8つの良かった点と反省点最近、実務に導入してみたフロントエンドの技術8つの良かった点と反省点
最近、実務に導入してみたフロントエンドの技術8つの良かった点と反省点
 
第10回勉強会 CSS設計について
第10回勉強会 CSS設計について第10回勉強会 CSS設計について
第10回勉強会 CSS設計について
 
設計から実装まで、今すぐ始める高速化
設計から実装まで、今すぐ始める高速化設計から実装まで、今すぐ始める高速化
設計から実装まで、今すぐ始める高速化
 
css基本。
css基本。css基本。
css基本。
 
Styleguide Driven Development x CMS - MTDDC Tokyo 2015
Styleguide Driven Development x CMS - MTDDC Tokyo 2015Styleguide Driven Development x CMS - MTDDC Tokyo 2015
Styleguide Driven Development x CMS - MTDDC Tokyo 2015
 
SMACSS入門
SMACSS入門SMACSS入門
SMACSS入門
 
CSSフレームワークを使った 簡単なレスポンシブデザインの作成
CSSフレームワークを使った 簡単なレスポンシブデザインの作成CSSフレームワークを使った 簡単なレスポンシブデザインの作成
CSSフレームワークを使った 簡単なレスポンシブデザインの作成
 
CSS設計のお勉強
CSS設計のお勉強CSS設計のお勉強
CSS設計のお勉強
 
モダンCSS設計と BEMという開発手法
モダンCSS設計と BEMという開発手法モダンCSS設計と BEMという開発手法
モダンCSS設計と BEMという開発手法
 
Web勉強会(HTML+CSS+JS入門の入門)
Web勉強会(HTML+CSS+JS入門の入門)Web勉強会(HTML+CSS+JS入門の入門)
Web勉強会(HTML+CSS+JS入門の入門)
 
コーディングが上達するコツ
コーディングが上達するコツコーディングが上達するコツ
コーディングが上達するコツ
 
WordPressでCSSプリプロセッサ入門
WordPressでCSSプリプロセッサ入門WordPressでCSSプリプロセッサ入門
WordPressでCSSプリプロセッサ入門
 
知っておきたい「Web制作イマドキの注目ポイント」
知っておきたい「Web制作イマドキの注目ポイント」知っておきたい「Web制作イマドキの注目ポイント」
知っておきたい「Web制作イマドキの注目ポイント」
 
Oocssとかついでにsmacssとbemの話も
Oocssとかついでにsmacssとbemの話もOocssとかついでにsmacssとbemの話も
Oocssとかついでにsmacssとbemの話も
 
これくらいはやってほしいWebデザイン
これくらいはやってほしいWebデザインこれくらいはやってほしいWebデザイン
これくらいはやってほしいWebデザイン
 

Viewers also liked

メンテナブルでありつづけるためのCSS設計
メンテナブルでありつづけるためのCSS設計メンテナブルでありつづけるためのCSS設計
メンテナブルでありつづけるためのCSS設計拓樹 谷
 
なんでCSSすぐ死んでしまうん
なんでCSSすぐ死んでしまうんなんでCSSすぐ死んでしまうん
なんでCSSすぐ死んでしまうんHayato Mizuno
 
ノンデザイナーのためのWebデザイン講座
ノンデザイナーのためのWebデザイン講座ノンデザイナーのためのWebデザイン講座
ノンデザイナーのためのWebデザイン講座光利 吉田
 
プログラマがデザインをがんばってみた
プログラマがデザインをがんばってみたプログラマがデザインをがんばってみた
プログラマがデザインをがんばってみただいすけ ふるかわ
 
プログラマがWebデザインについて考えてみた
プログラマがWebデザインについて考えてみたプログラマがWebデザインについて考えてみた
プログラマがWebデザインについて考えてみたEigoro Yamamura
 
Webデザインのトーン&マナーを導き出す手法
Webデザインのトーン&マナーを導き出す手法Webデザインのトーン&マナーを導き出す手法
Webデザインのトーン&マナーを導き出す手法Katsumi Tazuke
 
デザインのためのデザイン
デザインのためのデザインデザインのためのデザイン
デザインのためのデザインMasayuki Uetani
 
WordCamp Kansai 2015 デザイン初心者向けワークショップ〜 ブログデザインを実際に作ってみよう〜
WordCamp Kansai 2015 デザイン初心者向けワークショップ〜 ブログデザインを実際に作ってみよう〜WordCamp Kansai 2015 デザイン初心者向けワークショップ〜 ブログデザインを実際に作ってみよう〜
WordCamp Kansai 2015 デザイン初心者向けワークショップ〜 ブログデザインを実際に作ってみよう〜Ayaka Sumida
 
ノンデザイナーのための「デザインの判断」はとりあえずコレだけおさえよう
ノンデザイナーのための「デザインの判断」はとりあえずコレだけおさえようノンデザイナーのための「デザインの判断」はとりあえずコレだけおさえよう
ノンデザイナーのための「デザインの判断」はとりあえずコレだけおさえようSasaki Kouhei
 
Webデザインのセオリーを学ぼう
Webデザインのセオリーを学ぼうWebデザインのセオリーを学ぼう
Webデザインのセオリーを学ぼうToshiaki Sasaki
 
ノンデザイナーのための配色理論
ノンデザイナーのための配色理論ノンデザイナーのための配色理論
ノンデザイナーのための配色理論tsukasa obara
 
色彩センスのいらない配色講座
色彩センスのいらない配色講座色彩センスのいらない配色講座
色彩センスのいらない配色講座Mariko Yamaguchi
 

Viewers also liked (13)

メンテナブルでありつづけるためのCSS設計
メンテナブルでありつづけるためのCSS設計メンテナブルでありつづけるためのCSS設計
メンテナブルでありつづけるためのCSS設計
 
なんでCSSすぐ死んでしまうん
なんでCSSすぐ死んでしまうんなんでCSSすぐ死んでしまうん
なんでCSSすぐ死んでしまうん
 
Web design
Web designWeb design
Web design
 
ノンデザイナーのためのWebデザイン講座
ノンデザイナーのためのWebデザイン講座ノンデザイナーのためのWebデザイン講座
ノンデザイナーのためのWebデザイン講座
 
プログラマがデザインをがんばってみた
プログラマがデザインをがんばってみたプログラマがデザインをがんばってみた
プログラマがデザインをがんばってみた
 
プログラマがWebデザインについて考えてみた
プログラマがWebデザインについて考えてみたプログラマがWebデザインについて考えてみた
プログラマがWebデザインについて考えてみた
 
Webデザインのトーン&マナーを導き出す手法
Webデザインのトーン&マナーを導き出す手法Webデザインのトーン&マナーを導き出す手法
Webデザインのトーン&マナーを導き出す手法
 
デザインのためのデザイン
デザインのためのデザインデザインのためのデザイン
デザインのためのデザイン
 
WordCamp Kansai 2015 デザイン初心者向けワークショップ〜 ブログデザインを実際に作ってみよう〜
WordCamp Kansai 2015 デザイン初心者向けワークショップ〜 ブログデザインを実際に作ってみよう〜WordCamp Kansai 2015 デザイン初心者向けワークショップ〜 ブログデザインを実際に作ってみよう〜
WordCamp Kansai 2015 デザイン初心者向けワークショップ〜 ブログデザインを実際に作ってみよう〜
 
ノンデザイナーのための「デザインの判断」はとりあえずコレだけおさえよう
ノンデザイナーのための「デザインの判断」はとりあえずコレだけおさえようノンデザイナーのための「デザインの判断」はとりあえずコレだけおさえよう
ノンデザイナーのための「デザインの判断」はとりあえずコレだけおさえよう
 
Webデザインのセオリーを学ぼう
Webデザインのセオリーを学ぼうWebデザインのセオリーを学ぼう
Webデザインのセオリーを学ぼう
 
ノンデザイナーのための配色理論
ノンデザイナーのための配色理論ノンデザイナーのための配色理論
ノンデザイナーのための配色理論
 
色彩センスのいらない配色講座
色彩センスのいらない配色講座色彩センスのいらない配色講座
色彩センスのいらない配色講座
 

Similar to ヒューマンリーダブルな CSS 記述法(異次元編):2016年5月13日 CodeGrid 四周年記念パーティー

HCDのはじめの一歩を体験しよう! ユーザーインタビューの基本:2016年8月5日 メンバーズキャリア
HCDのはじめの一歩を体験しよう! ユーザーインタビューの基本:2016年8月5日 メンバーズキャリアHCDのはじめの一歩を体験しよう! ユーザーインタビューの基本:2016年8月5日 メンバーズキャリア
HCDのはじめの一歩を体験しよう! ユーザーインタビューの基本:2016年8月5日 メンバーズキャリアYoshiki Hayama
 
「UXデザインと組織論」に、正面から向きあってみた:2016年2月27日 『人間中心デザイン』HCD導入設計論
「UXデザインと組織論」に、正面から向きあってみた:2016年2月27日 『人間中心デザイン』HCD導入設計論「UXデザインと組織論」に、正面から向きあってみた:2016年2月27日 『人間中心デザイン』HCD導入設計論
「UXデザインと組織論」に、正面から向きあってみた:2016年2月27日 『人間中心デザイン』HCD導入設計論Yoshiki Hayama
 
de:code 夏まつり クイズクライアント作ったよ!
de:code 夏まつり クイズクライアント作ったよ!de:code 夏まつり クイズクライアント作ったよ!
de:code 夏まつり クイズクライアント作ったよ!Kazumi IWANAGA
 
NS study8 DDD Microservices Azuer Service Fabric
NS study8 DDD Microservices Azuer Service FabricNS study8 DDD Microservices Azuer Service Fabric
NS study8 DDD Microservices Azuer Service Fabric貴志 上坂
 
45分間で「ユーザー中心のものづくり」ができるまで詰め込む
45分間で「ユーザー中心のものづくり」ができるまで詰め込む45分間で「ユーザー中心のものづくり」ができるまで詰め込む
45分間で「ユーザー中心のものづくり」ができるまで詰め込むYoshiki Hayama
 
SEO x UX ユーザー心理によるコンテンツプランニング
SEO x UX ユーザー心理によるコンテンツプランニングSEO x UX ユーザー心理によるコンテンツプランニング
SEO x UX ユーザー心理によるコンテンツプランニングYoshiki Hayama
 
始めよう! ドメイン駆動設計&マイクロサービス開発 ~C# と Azure Service Fabric で最高の DDD 開発を~
始めよう! ドメイン駆動設計&マイクロサービス開発 ~C# と Azure Service Fabric で最高の DDD 開発を~始めよう! ドメイン駆動設計&マイクロサービス開発 ~C# と Azure Service Fabric で最高の DDD 開発を~
始めよう! ドメイン駆動設計&マイクロサービス開発 ~C# と Azure Service Fabric で最高の DDD 開発を~貴志 上坂
 
フロントエンド制作向け ビルドツールGruntを PHPバックエンド開発で利用する @M_Ishikawa #phpcon2013
フロントエンド制作向け ビルドツールGruntを PHPバックエンド開発で利用する @M_Ishikawa #phpcon2013フロントエンド制作向け ビルドツールGruntを PHPバックエンド開発で利用する @M_Ishikawa #phpcon2013
フロントエンド制作向け ビルドツールGruntを PHPバックエンド開発で利用する @M_Ishikawa #phpcon2013Masayuki Ishikawa
 
Adobe xdモバイルアプリとの連携利用
Adobe xdモバイルアプリとの連携利用Adobe xdモバイルアプリとの連携利用
Adobe xdモバイルアプリとの連携利用Kazuma Sekiguchi
 
Webの仕組みとプログラミング言語
Webの仕組みとプログラミング言語Webの仕組みとプログラミング言語
Webの仕組みとプログラミング言語Yossy Taka
 
UXデザインの資格ってどんなの? HCD-Net認定 人間中心設計スペシャリスト・人間中心設計専門家
UXデザインの資格ってどんなの? HCD-Net認定 人間中心設計スペシャリスト・人間中心設計専門家UXデザインの資格ってどんなの? HCD-Net認定 人間中心設計スペシャリスト・人間中心設計専門家
UXデザインの資格ってどんなの? HCD-Net認定 人間中心設計スペシャリスト・人間中心設計専門家Yoshiki Hayama
 
お客様の目を覚ませ! ついでに自分の目も覚ませ! デザイン思考のクライアントワークのプレセールス
お客様の目を覚ませ! ついでに自分の目も覚ませ! デザイン思考のクライアントワークのプレセールスお客様の目を覚ませ! ついでに自分の目も覚ませ! デザイン思考のクライアントワークのプレセールス
お客様の目を覚ませ! ついでに自分の目も覚ませ! デザイン思考のクライアントワークのプレセールスYoshiki Hayama
 
データベース不要のCMS Picoについて
データベース不要のCMS Picoについてデータベース不要のCMS Picoについて
データベース不要のCMS Picoについて高見 知英
 
ドメイン駆動設計のための Spring の上手な使い方
ドメイン駆動設計のための Spring の上手な使い方ドメイン駆動設計のための Spring の上手な使い方
ドメイン駆動設計のための Spring の上手な使い方増田 亨
 
レスポンシブWebデザイン【基礎編】
レスポンシブWebデザイン【基礎編】レスポンシブWebデザイン【基礎編】
レスポンシブWebデザイン【基礎編】Yasuhito Yabe
 
20161208 Classmethod Codenize Tools
20161208 Classmethod Codenize Tools20161208 Classmethod Codenize Tools
20161208 Classmethod Codenize ToolsKazuki Ueki
 
CSSフレームワークとCMS+RWDテンプレでレスポンシブWebデザインサイトを構築しよう
CSSフレームワークとCMS+RWDテンプレでレスポンシブWebデザインサイトを構築しようCSSフレームワークとCMS+RWDテンプレでレスポンシブWebデザインサイトを構築しよう
CSSフレームワークとCMS+RWDテンプレでレスポンシブWebデザインサイトを構築しようMasayuki Abe
 
Gumi study#15 Sass構造化
Gumi study#15 Sass構造化Gumi study#15 Sass構造化
Gumi study#15 Sass構造化Haraguchi Go
 
エンジニアとデザイナーとの距離
エンジニアとデザイナーとの距離エンジニアとデザイナーとの距離
エンジニアとデザイナーとの距離Manabu Yasuda
 
Htmlコーディングの効率化 前編
Htmlコーディングの効率化 前編Htmlコーディングの効率化 前編
Htmlコーディングの効率化 前編Yasuhito Yabe
 

Similar to ヒューマンリーダブルな CSS 記述法(異次元編):2016年5月13日 CodeGrid 四周年記念パーティー (20)

HCDのはじめの一歩を体験しよう! ユーザーインタビューの基本:2016年8月5日 メンバーズキャリア
HCDのはじめの一歩を体験しよう! ユーザーインタビューの基本:2016年8月5日 メンバーズキャリアHCDのはじめの一歩を体験しよう! ユーザーインタビューの基本:2016年8月5日 メンバーズキャリア
HCDのはじめの一歩を体験しよう! ユーザーインタビューの基本:2016年8月5日 メンバーズキャリア
 
「UXデザインと組織論」に、正面から向きあってみた:2016年2月27日 『人間中心デザイン』HCD導入設計論
「UXデザインと組織論」に、正面から向きあってみた:2016年2月27日 『人間中心デザイン』HCD導入設計論「UXデザインと組織論」に、正面から向きあってみた:2016年2月27日 『人間中心デザイン』HCD導入設計論
「UXデザインと組織論」に、正面から向きあってみた:2016年2月27日 『人間中心デザイン』HCD導入設計論
 
de:code 夏まつり クイズクライアント作ったよ!
de:code 夏まつり クイズクライアント作ったよ!de:code 夏まつり クイズクライアント作ったよ!
de:code 夏まつり クイズクライアント作ったよ!
 
NS study8 DDD Microservices Azuer Service Fabric
NS study8 DDD Microservices Azuer Service FabricNS study8 DDD Microservices Azuer Service Fabric
NS study8 DDD Microservices Azuer Service Fabric
 
45分間で「ユーザー中心のものづくり」ができるまで詰め込む
45分間で「ユーザー中心のものづくり」ができるまで詰め込む45分間で「ユーザー中心のものづくり」ができるまで詰め込む
45分間で「ユーザー中心のものづくり」ができるまで詰め込む
 
SEO x UX ユーザー心理によるコンテンツプランニング
SEO x UX ユーザー心理によるコンテンツプランニングSEO x UX ユーザー心理によるコンテンツプランニング
SEO x UX ユーザー心理によるコンテンツプランニング
 
始めよう! ドメイン駆動設計&マイクロサービス開発 ~C# と Azure Service Fabric で最高の DDD 開発を~
始めよう! ドメイン駆動設計&マイクロサービス開発 ~C# と Azure Service Fabric で最高の DDD 開発を~始めよう! ドメイン駆動設計&マイクロサービス開発 ~C# と Azure Service Fabric で最高の DDD 開発を~
始めよう! ドメイン駆動設計&マイクロサービス開発 ~C# と Azure Service Fabric で最高の DDD 開発を~
 
フロントエンド制作向け ビルドツールGruntを PHPバックエンド開発で利用する @M_Ishikawa #phpcon2013
フロントエンド制作向け ビルドツールGruntを PHPバックエンド開発で利用する @M_Ishikawa #phpcon2013フロントエンド制作向け ビルドツールGruntを PHPバックエンド開発で利用する @M_Ishikawa #phpcon2013
フロントエンド制作向け ビルドツールGruntを PHPバックエンド開発で利用する @M_Ishikawa #phpcon2013
 
Adobe xdモバイルアプリとの連携利用
Adobe xdモバイルアプリとの連携利用Adobe xdモバイルアプリとの連携利用
Adobe xdモバイルアプリとの連携利用
 
Webの仕組みとプログラミング言語
Webの仕組みとプログラミング言語Webの仕組みとプログラミング言語
Webの仕組みとプログラミング言語
 
UXデザインの資格ってどんなの? HCD-Net認定 人間中心設計スペシャリスト・人間中心設計専門家
UXデザインの資格ってどんなの? HCD-Net認定 人間中心設計スペシャリスト・人間中心設計専門家UXデザインの資格ってどんなの? HCD-Net認定 人間中心設計スペシャリスト・人間中心設計専門家
UXデザインの資格ってどんなの? HCD-Net認定 人間中心設計スペシャリスト・人間中心設計専門家
 
お客様の目を覚ませ! ついでに自分の目も覚ませ! デザイン思考のクライアントワークのプレセールス
お客様の目を覚ませ! ついでに自分の目も覚ませ! デザイン思考のクライアントワークのプレセールスお客様の目を覚ませ! ついでに自分の目も覚ませ! デザイン思考のクライアントワークのプレセールス
お客様の目を覚ませ! ついでに自分の目も覚ませ! デザイン思考のクライアントワークのプレセールス
 
データベース不要のCMS Picoについて
データベース不要のCMS Picoについてデータベース不要のCMS Picoについて
データベース不要のCMS Picoについて
 
ドメイン駆動設計のための Spring の上手な使い方
ドメイン駆動設計のための Spring の上手な使い方ドメイン駆動設計のための Spring の上手な使い方
ドメイン駆動設計のための Spring の上手な使い方
 
レスポンシブWebデザイン【基礎編】
レスポンシブWebデザイン【基礎編】レスポンシブWebデザイン【基礎編】
レスポンシブWebデザイン【基礎編】
 
20161208 Classmethod Codenize Tools
20161208 Classmethod Codenize Tools20161208 Classmethod Codenize Tools
20161208 Classmethod Codenize Tools
 
CSSフレームワークとCMS+RWDテンプレでレスポンシブWebデザインサイトを構築しよう
CSSフレームワークとCMS+RWDテンプレでレスポンシブWebデザインサイトを構築しようCSSフレームワークとCMS+RWDテンプレでレスポンシブWebデザインサイトを構築しよう
CSSフレームワークとCMS+RWDテンプレでレスポンシブWebデザインサイトを構築しよう
 
Gumi study#15 Sass構造化
Gumi study#15 Sass構造化Gumi study#15 Sass構造化
Gumi study#15 Sass構造化
 
エンジニアとデザイナーとの距離
エンジニアとデザイナーとの距離エンジニアとデザイナーとの距離
エンジニアとデザイナーとの距離
 
Htmlコーディングの効率化 前編
Htmlコーディングの効率化 前編Htmlコーディングの効率化 前編
Htmlコーディングの効率化 前編
 

More from Yoshiki Hayama

生成AI? LLM? UXデザインにどうつなげればいいの? 人にうれしいAIプロダクトをつくるUXデザイン
生成AI? LLM? UXデザインにどうつなげればいいの? 人にうれしいAIプロダクトをつくるUXデザイン生成AI? LLM? UXデザインにどうつなげればいいの? 人にうれしいAIプロダクトをつくるUXデザイン
生成AI? LLM? UXデザインにどうつなげればいいの? 人にうれしいAIプロダクトをつくるUXデザインYoshiki Hayama
 
そして僕は粛々とサービスデザインをするだけ
そして僕は粛々とサービスデザインをするだけそして僕は粛々とサービスデザインをするだけ
そして僕は粛々とサービスデザインをするだけYoshiki Hayama
 
【実録】Web担イベントページのフルリニューアル ユーザー操作は“想定外の行動だらけ”! UXリサーチで見えた真の課題と改善策
【実録】Web担イベントページのフルリニューアル ユーザー操作は“想定外の行動だらけ”! UXリサーチで見えた真の課題と改善策【実録】Web担イベントページのフルリニューアル ユーザー操作は“想定外の行動だらけ”! UXリサーチで見えた真の課題と改善策
【実録】Web担イベントページのフルリニューアル ユーザー操作は“想定外の行動だらけ”! UXリサーチで見えた真の課題と改善策Yoshiki Hayama
 
プロが生実演! 「ユーザーインタビュー」の深掘りテクニックを大公開!
プロが生実演! 「ユーザーインタビュー」の深掘りテクニックを大公開!プロが生実演! 「ユーザーインタビュー」の深掘りテクニックを大公開!
プロが生実演! 「ユーザーインタビュー」の深掘りテクニックを大公開!Yoshiki Hayama
 
【2023年版】UXデザインの資格ってどんなの? HCD-Net認定 人間中心設計スペシャリスト・人間中心設計専門家
【2023年版】UXデザインの資格ってどんなの? HCD-Net認定 人間中心設計スペシャリスト・人間中心設計専門家【2023年版】UXデザインの資格ってどんなの? HCD-Net認定 人間中心設計スペシャリスト・人間中心設計専門家
【2023年版】UXデザインの資格ってどんなの? HCD-Net認定 人間中心設計スペシャリスト・人間中心設計専門家Yoshiki Hayama
 
ワークショップのアイデア発想で「AIでユーザーに最適な情報を出します」とか言うな
ワークショップのアイデア発想で「AIでユーザーに最適な情報を出します」とか言うなワークショップのアイデア発想で「AIでユーザーに最適な情報を出します」とか言うな
ワークショップのアイデア発想で「AIでユーザーに最適な情報を出します」とか言うなYoshiki Hayama
 
ユーザー調査・分析に基づいた、“刺さる” WEBサービス・プロダクトデザイン
ユーザー調査・分析に基づいた、“刺さる” WEBサービス・プロダクトデザインユーザー調査・分析に基づいた、“刺さる” WEBサービス・プロダクトデザイン
ユーザー調査・分析に基づいた、“刺さる” WEBサービス・プロダクトデザインYoshiki Hayama
 
ターゲット心理をつかむ、正しいユーザー調査・分析
ターゲット心理をつかむ、正しいユーザー調査・分析ターゲット心理をつかむ、正しいユーザー調査・分析
ターゲット心理をつかむ、正しいユーザー調査・分析Yoshiki Hayama
 
UXのリバースエンジニアリング
UXのリバースエンジニアリングUXのリバースエンジニアリング
UXのリバースエンジニアリングYoshiki Hayama
 
ユーザーインタビューからその後どうするの? 発話録からKA法(本質的価値抽出法)でインサイトを見つけよう!
ユーザーインタビューからその後どうするの? 発話録からKA法(本質的価値抽出法)でインサイトを見つけよう!ユーザーインタビューからその後どうするの? 発話録からKA法(本質的価値抽出法)でインサイトを見つけよう!
ユーザーインタビューからその後どうするの? 発話録からKA法(本質的価値抽出法)でインサイトを見つけよう!Yoshiki Hayama
 
AIによる未来のUXデサイン? 〜 ChatGPT・AIartなど 〜
AIによる未来のUXデサイン? 〜 ChatGPT・AIartなど 〜AIによる未来のUXデサイン? 〜 ChatGPT・AIartなど 〜
AIによる未来のUXデサイン? 〜 ChatGPT・AIartなど 〜Yoshiki Hayama
 
ウェブ/アプリのUX改善 データ分析と定性分析の絶妙なバランスは?
ウェブ/アプリのUX改善 データ分析と定性分析の絶妙なバランスは?ウェブ/アプリのUX改善 データ分析と定性分析の絶妙なバランスは?
ウェブ/アプリのUX改善 データ分析と定性分析の絶妙なバランスは?Yoshiki Hayama
 
IT推進に必要なUXを学ぶ ~UXを意識して真の業務改善・真のDXを目指す~
IT推進に必要なUXを学ぶ ~UXを意識して真の業務改善・真のDXを目指す~IT推進に必要なUXを学ぶ ~UXを意識して真の業務改善・真のDXを目指す~
IT推進に必要なUXを学ぶ ~UXを意識して真の業務改善・真のDXを目指す~Yoshiki Hayama
 
UXデザイナーになりたい僕らのサバイバル生存戦略 〜UXデザイン・UXリサーチはどうやって学べばいいの?〜 | UX BOOST!! Vol.1
UXデザイナーになりたい僕らのサバイバル生存戦略 〜UXデザイン・UXリサーチはどうやって学べばいいの?〜 | UX BOOST!!  Vol.1 UXデザイナーになりたい僕らのサバイバル生存戦略 〜UXデザイン・UXリサーチはどうやって学べばいいの?〜 | UX BOOST!!  Vol.1
UXデザイナーになりたい僕らのサバイバル生存戦略 〜UXデザイン・UXリサーチはどうやって学べばいいの?〜 | UX BOOST!! Vol.1 Yoshiki Hayama
 
UXデザインのはじめの一歩を体験しよう! ユーザーインタビューの基本 [第2版] | UXデザイン実践セミナー 第2回
UXデザインのはじめの一歩を体験しよう! ユーザーインタビューの基本 [第2版] | UXデザイン実践セミナー 第2回UXデザインのはじめの一歩を体験しよう! ユーザーインタビューの基本 [第2版] | UXデザイン実践セミナー 第2回
UXデザインのはじめの一歩を体験しよう! ユーザーインタビューの基本 [第2版] | UXデザイン実践セミナー 第2回Yoshiki Hayama
 
UXデザインのはじめの一歩を体験しよう! ユーザーインタビューの基本 | UXデザイン実践セミナー 第1回
UXデザインのはじめの一歩を体験しよう! ユーザーインタビューの基本 | UXデザイン実践セミナー 第1回UXデザインのはじめの一歩を体験しよう! ユーザーインタビューの基本 | UXデザイン実践セミナー 第1回
UXデザインのはじめの一歩を体験しよう! ユーザーインタビューの基本 | UXデザイン実践セミナー 第1回Yoshiki Hayama
 
「ウチの事業部の商品をWebサイト・アプリで目立たせて!」私だけじゃなかった! 社内政治と落としどころの見つけ方
「ウチの事業部の商品をWebサイト・アプリで目立たせて!」私だけじゃなかった! 社内政治と落としどころの見つけ方「ウチの事業部の商品をWebサイト・アプリで目立たせて!」私だけじゃなかった! 社内政治と落としどころの見つけ方
「ウチの事業部の商品をWebサイト・アプリで目立たせて!」私だけじゃなかった! 社内政治と落としどころの見つけ方Yoshiki Hayama
 
あなたの手元の本よりいい方法がある! UXデザインのプロはこうやってユーザーのインサイトを確実に見つける
あなたの手元の本よりいい方法がある! UXデザインのプロはこうやってユーザーのインサイトを確実に見つけるあなたの手元の本よりいい方法がある! UXデザインのプロはこうやってユーザーのインサイトを確実に見つける
あなたの手元の本よりいい方法がある! UXデザインのプロはこうやってユーザーのインサイトを確実に見つけるYoshiki Hayama
 
プロトタイピングとユーザビリティテストで「UXデザイン」を練りあげよう! | UXデザイン基礎セミナー 第4回
プロトタイピングとユーザビリティテストで「UXデザイン」を練りあげよう! | UXデザイン基礎セミナー 第4回プロトタイピングとユーザビリティテストで「UXデザイン」を練りあげよう! | UXデザイン基礎セミナー 第4回
プロトタイピングとユーザビリティテストで「UXデザイン」を練りあげよう! | UXデザイン基礎セミナー 第4回Yoshiki Hayama
 
UXデザインの海外最新「UXトレンドレポート2022」を読んで、考える
UXデザインの海外最新「UXトレンドレポート2022」を読んで、考えるUXデザインの海外最新「UXトレンドレポート2022」を読んで、考える
UXデザインの海外最新「UXトレンドレポート2022」を読んで、考えるYoshiki Hayama
 

More from Yoshiki Hayama (20)

生成AI? LLM? UXデザインにどうつなげればいいの? 人にうれしいAIプロダクトをつくるUXデザイン
生成AI? LLM? UXデザインにどうつなげればいいの? 人にうれしいAIプロダクトをつくるUXデザイン生成AI? LLM? UXデザインにどうつなげればいいの? 人にうれしいAIプロダクトをつくるUXデザイン
生成AI? LLM? UXデザインにどうつなげればいいの? 人にうれしいAIプロダクトをつくるUXデザイン
 
そして僕は粛々とサービスデザインをするだけ
そして僕は粛々とサービスデザインをするだけそして僕は粛々とサービスデザインをするだけ
そして僕は粛々とサービスデザインをするだけ
 
【実録】Web担イベントページのフルリニューアル ユーザー操作は“想定外の行動だらけ”! UXリサーチで見えた真の課題と改善策
【実録】Web担イベントページのフルリニューアル ユーザー操作は“想定外の行動だらけ”! UXリサーチで見えた真の課題と改善策【実録】Web担イベントページのフルリニューアル ユーザー操作は“想定外の行動だらけ”! UXリサーチで見えた真の課題と改善策
【実録】Web担イベントページのフルリニューアル ユーザー操作は“想定外の行動だらけ”! UXリサーチで見えた真の課題と改善策
 
プロが生実演! 「ユーザーインタビュー」の深掘りテクニックを大公開!
プロが生実演! 「ユーザーインタビュー」の深掘りテクニックを大公開!プロが生実演! 「ユーザーインタビュー」の深掘りテクニックを大公開!
プロが生実演! 「ユーザーインタビュー」の深掘りテクニックを大公開!
 
【2023年版】UXデザインの資格ってどんなの? HCD-Net認定 人間中心設計スペシャリスト・人間中心設計専門家
【2023年版】UXデザインの資格ってどんなの? HCD-Net認定 人間中心設計スペシャリスト・人間中心設計専門家【2023年版】UXデザインの資格ってどんなの? HCD-Net認定 人間中心設計スペシャリスト・人間中心設計専門家
【2023年版】UXデザインの資格ってどんなの? HCD-Net認定 人間中心設計スペシャリスト・人間中心設計専門家
 
ワークショップのアイデア発想で「AIでユーザーに最適な情報を出します」とか言うな
ワークショップのアイデア発想で「AIでユーザーに最適な情報を出します」とか言うなワークショップのアイデア発想で「AIでユーザーに最適な情報を出します」とか言うな
ワークショップのアイデア発想で「AIでユーザーに最適な情報を出します」とか言うな
 
ユーザー調査・分析に基づいた、“刺さる” WEBサービス・プロダクトデザイン
ユーザー調査・分析に基づいた、“刺さる” WEBサービス・プロダクトデザインユーザー調査・分析に基づいた、“刺さる” WEBサービス・プロダクトデザイン
ユーザー調査・分析に基づいた、“刺さる” WEBサービス・プロダクトデザイン
 
ターゲット心理をつかむ、正しいユーザー調査・分析
ターゲット心理をつかむ、正しいユーザー調査・分析ターゲット心理をつかむ、正しいユーザー調査・分析
ターゲット心理をつかむ、正しいユーザー調査・分析
 
UXのリバースエンジニアリング
UXのリバースエンジニアリングUXのリバースエンジニアリング
UXのリバースエンジニアリング
 
ユーザーインタビューからその後どうするの? 発話録からKA法(本質的価値抽出法)でインサイトを見つけよう!
ユーザーインタビューからその後どうするの? 発話録からKA法(本質的価値抽出法)でインサイトを見つけよう!ユーザーインタビューからその後どうするの? 発話録からKA法(本質的価値抽出法)でインサイトを見つけよう!
ユーザーインタビューからその後どうするの? 発話録からKA法(本質的価値抽出法)でインサイトを見つけよう!
 
AIによる未来のUXデサイン? 〜 ChatGPT・AIartなど 〜
AIによる未来のUXデサイン? 〜 ChatGPT・AIartなど 〜AIによる未来のUXデサイン? 〜 ChatGPT・AIartなど 〜
AIによる未来のUXデサイン? 〜 ChatGPT・AIartなど 〜
 
ウェブ/アプリのUX改善 データ分析と定性分析の絶妙なバランスは?
ウェブ/アプリのUX改善 データ分析と定性分析の絶妙なバランスは?ウェブ/アプリのUX改善 データ分析と定性分析の絶妙なバランスは?
ウェブ/アプリのUX改善 データ分析と定性分析の絶妙なバランスは?
 
IT推進に必要なUXを学ぶ ~UXを意識して真の業務改善・真のDXを目指す~
IT推進に必要なUXを学ぶ ~UXを意識して真の業務改善・真のDXを目指す~IT推進に必要なUXを学ぶ ~UXを意識して真の業務改善・真のDXを目指す~
IT推進に必要なUXを学ぶ ~UXを意識して真の業務改善・真のDXを目指す~
 
UXデザイナーになりたい僕らのサバイバル生存戦略 〜UXデザイン・UXリサーチはどうやって学べばいいの?〜 | UX BOOST!! Vol.1
UXデザイナーになりたい僕らのサバイバル生存戦略 〜UXデザイン・UXリサーチはどうやって学べばいいの?〜 | UX BOOST!!  Vol.1 UXデザイナーになりたい僕らのサバイバル生存戦略 〜UXデザイン・UXリサーチはどうやって学べばいいの?〜 | UX BOOST!!  Vol.1
UXデザイナーになりたい僕らのサバイバル生存戦略 〜UXデザイン・UXリサーチはどうやって学べばいいの?〜 | UX BOOST!! Vol.1
 
UXデザインのはじめの一歩を体験しよう! ユーザーインタビューの基本 [第2版] | UXデザイン実践セミナー 第2回
UXデザインのはじめの一歩を体験しよう! ユーザーインタビューの基本 [第2版] | UXデザイン実践セミナー 第2回UXデザインのはじめの一歩を体験しよう! ユーザーインタビューの基本 [第2版] | UXデザイン実践セミナー 第2回
UXデザインのはじめの一歩を体験しよう! ユーザーインタビューの基本 [第2版] | UXデザイン実践セミナー 第2回
 
UXデザインのはじめの一歩を体験しよう! ユーザーインタビューの基本 | UXデザイン実践セミナー 第1回
UXデザインのはじめの一歩を体験しよう! ユーザーインタビューの基本 | UXデザイン実践セミナー 第1回UXデザインのはじめの一歩を体験しよう! ユーザーインタビューの基本 | UXデザイン実践セミナー 第1回
UXデザインのはじめの一歩を体験しよう! ユーザーインタビューの基本 | UXデザイン実践セミナー 第1回
 
「ウチの事業部の商品をWebサイト・アプリで目立たせて!」私だけじゃなかった! 社内政治と落としどころの見つけ方
「ウチの事業部の商品をWebサイト・アプリで目立たせて!」私だけじゃなかった! 社内政治と落としどころの見つけ方「ウチの事業部の商品をWebサイト・アプリで目立たせて!」私だけじゃなかった! 社内政治と落としどころの見つけ方
「ウチの事業部の商品をWebサイト・アプリで目立たせて!」私だけじゃなかった! 社内政治と落としどころの見つけ方
 
あなたの手元の本よりいい方法がある! UXデザインのプロはこうやってユーザーのインサイトを確実に見つける
あなたの手元の本よりいい方法がある! UXデザインのプロはこうやってユーザーのインサイトを確実に見つけるあなたの手元の本よりいい方法がある! UXデザインのプロはこうやってユーザーのインサイトを確実に見つける
あなたの手元の本よりいい方法がある! UXデザインのプロはこうやってユーザーのインサイトを確実に見つける
 
プロトタイピングとユーザビリティテストで「UXデザイン」を練りあげよう! | UXデザイン基礎セミナー 第4回
プロトタイピングとユーザビリティテストで「UXデザイン」を練りあげよう! | UXデザイン基礎セミナー 第4回プロトタイピングとユーザビリティテストで「UXデザイン」を練りあげよう! | UXデザイン基礎セミナー 第4回
プロトタイピングとユーザビリティテストで「UXデザイン」を練りあげよう! | UXデザイン基礎セミナー 第4回
 
UXデザインの海外最新「UXトレンドレポート2022」を読んで、考える
UXデザインの海外最新「UXトレンドレポート2022」を読んで、考えるUXデザインの海外最新「UXトレンドレポート2022」を読んで、考える
UXデザインの海外最新「UXトレンドレポート2022」を読んで、考える
 

ヒューマンリーダブルな CSS 記述法(異次元編):2016年5月13日 CodeGrid 四周年記念パーティー