UI設計の土台になる考え方-インテリジェントネット社内勉強会

UI設計の土台になる考え方
©2014 Intelligentnet, Inc. All rights reserved.
インテリジェントネット社内勉強会
徳永聡
∧∧ ／￣￣￣￣￣
(,,ﾟДﾟ)＜はじまるよ！
⊂ ⊃ ＼＿＿＿＿＿
～| |
,, し`J

今日のお話の前提1/2
1. これを聞いたからすぐに超素敵UI設計ができるよ
うになるわけじゃありません。
2. でも聞かないよりは聞いたほうが良い設計はでき
ると思います
3. 少なくともUI設計のタイミングで「どういう判断
基準で考えれば良いか」はわかるようになると思
います

今日のお話の前提2/2
1. 便宜上なんとなく「UI設計」としています。「UI
設計」には本来ビジュアルデザインも入ってきま
すが、今日はその手前の「画面構成まで」です。
2. だから「UI設計（の基礎）」＝「画面構成」とい
うことで聞いてください。
3. メモは取らなくて大丈夫です。話すことのほとん
どはスライドにしてあります。
4. そのため、物凄いスピードでスライドが進みます。
（たぶん1枚平均数秒です）

もくじ
1. UI設計はです
2. 「UI設計」の主な範囲と
「設計する前の大事なこと」
3. 「UI設計」のいろんな事例
4. UI設計の手法と実践（パターン）

でははじめます

突然ですが質問です。

採用を強化したいので、
採用情報をもっと目立たせたい。

どうする？

こんなのは簡単です

こうすればいい

こうすればいい
げっきゅう
いちおくえん！

こんなのはUIの設計や提案とは言わない
(*´з`).oO(厳密には言わないことはない)

グロナビはこうなります
一番推すべき
コンテンツはこれです
すべてのユーザーへの
おすすめコンテンツを
ここに置きます

これが本来あるべきUIの設計や提案
グロナビはこうなります
一番おすべき
コンテンツはこれです
すべてのユーザーへの
おすすめコンテンツを
置きます

よくある話

「全部目立たせて」

はい無理。

はい無理。
クライアントはだいたいこんなことを言う
Ｂｙ C.W.ニコル（嘘）

「だって全部大事だから」
「ここ事業部の担当者がうるさいので」
「うちはサービスがいっぱいあるから」

「うちはサービスも顧客も
たくさんで複雑なんだよね」
（Web屋さんにはわからんだろうけどね）

そんなときはこう返す

（ ´_ゝ`）そうですか

でも
無理なものは無理。
「うちはサービスも顧客も
たくさんで複雑なんだよね」
（Web屋さんにはわからんだろうけどね）
そもそもこういう話は
だいたいどこでも同じ
みんな複雑。

たとえばサーラ住宅サイト。

•キービジュアル
•サムネイル
•注力コンテンツ
•イベント情報
•フッター
・・・とか。

•キービジュアル
•サムネイル
•注力コンテンツ
•イベント情報
たとえばこれをドラマの配役で考える
・・・とか。

主演助演１
脇役
助演２
エキストラ

たとえば「踊る大捜査線」０１．UI設計はです
主演織田裕二
助演柳葉敏郎
助演深津絵里
脇役水野美紀
エキストラたまに出てくる警官
主演助演１
脇役
助演２
エキストラ

たとえばこの配役が、こんなだったら。

•織田裕二（BAC CORPORATION所属）
•木村拓哉（ジャニーズ事務所所属）
•オダギリジョー（鈍牛倶楽部所属）
•堺雅人（田辺エージェンシー所属）
•佐藤浩市（テアトル・ド・ポッシュ所属）
•長瀬智也（ジャニーズ事務所所属）
•二宮和也（ジャニーズ事務所所属）
•妻夫木聡（ホリプロ所属）
•向井理（ホリエージェンシー所属）
•草彅剛（ジャニーズ事務所所属）
•香取慎吾（ジャニーズ事務所所属）
•唐沢寿明（奥さんも研音所属）
結論：ジャニーズ事務所はすごい

•二宮和也（ジャニーズ事務所所属）
•妻夫木聡（ホリプロ所属）
•向井理（ホリエージェンシー所属）
•草彅剛（ジャニーズ事務所所属）
•香取慎吾（ジャニーズ事務所所属）
•唐沢寿明（奥さんも研音所属）
•織田裕二（BAC CORPORATION所属）
•木村拓哉（ジャニーズ事務所所属）
•オダギリジョー（鈍牛倶楽部所属）
•堺雅人（田辺エージェンシー所属）
•佐藤浩市（テアトル・ド・ポッシュ所属）
•長瀬智也（ジャニーズ事務所所属）
っていうのは冗談で。
こうなる：
物語の軸はだれ？？(´・ω・｀)

たとえばこんなシーンが。

織田裕二と妻夫木聡がカフェで会話
↓
そこに堺雅人が合流
↓
草彅剛演じるウェイターが注文取りに
↓
遠くの席に謎めいたオダギリジョー
↓
窓の外を香取慎吾が通り過ぎる

↓
↓
↓
遠くの席に謎めいたオダギリジョー
↓
実は、
ここからここまで、
物語に一切関係なし。

工エｴェｪ(´д｀)ｪェｴエ工
↓
↓
↓
遠くの席にオダギリジョー
↓
実は、
ここからここまで、
物語に一切関係なし。
なんと出演1シーンのみ。

たとえば「オールスター感謝祭」。

もはやカオス
TVならそれはそれで楽しいけど。

全部目立たせようにも、
こうなっちゃうわけです。
1. 結果的に一人一人は目立たなくなる。
2. 見てる人がどこに注目すればいいのか
わからなくなる

このように、
優先順位を決める
必要があるのです。
つまり。

さて。
「では何を主役にする？」

さて。
「では何を主役にする？」
それはビジネスが決める
ビジネス側だけじゃないけどだいたいビジネス側の話。

ビジネスとはたとえば。
•何に注力している？
•ユーザーに受け入れられている部分は？
•どこが競合より優れている？
•逆にどこが競合より劣っている？
•何を中心に提供すればユーザーが喜ぶ？

つまり。
つまり
つーーーまーーーり

突然すぎますがまとめます
この章をまとめます。

突然すぎますがまとめます
というわけでもう一度

UI設計は天才の所業ではないのです
まさかの否定が入ります

０２．「UI設計」の主な範囲と
|￣￣￣￣￣￣￣￣|
| 覚えてね!!! |
|＿＿＿＿＿＿＿＿|
∧∧ ||
( ﾟдﾟ)||
/ づΦ

みなさんは
分けて考えていますか？
突然「ACジャパン」みたいな
質問を投げかけてみる。
ええぇぇーぃしぃいいー♪(・∀・)

「設計する前の大事なこと」これを。
どこに
何を
どのように

「これをどのくらいのサイズと形で置こうかなぁ？」

「これをどのくらいのサイズと形で置こうかなぁ？」
そもそも
“これ”
を置くことは決定している？

3. 見（魅）せるのか
何を
1. 置くのか
2. 置くのか
どこに
どのように

何を
1. 置くのか
2. 置くのか
どこに
どのように
本来いっぺんに
考えることではない。

3. 見（魅）せるのかここがUI設計の中心。
何を
1. 置くのか
2. 置くのか
どこに
どのように

↓ここがデザインの中心。
何を
1. 置くのか
2. 置くのか
どこに
どのように

じゃあこれは？
何を
1. 置くのか
2. 置くのか
どこに
3. 置くのか
どのように
僕の大好きな「そもそも論」(・∀・)

何を置くのか
正しくは
何と何と何を置くのか。

これどうやって決める？
ﾊﾃ(゜-゜) ﾄﾞｳｼﾀﾓﾉｶ

|дﾟ)つ「このページでユーザーに
何を体験してもらう？」
ﾊﾃ(゜-゜) ﾄﾞｳｼﾀﾓﾉｶ

|дﾟ)つ「このページでユーザーに何を
体験してもらう？」
(゜-゜)ｺﾋﾟﾍﾟ・・・

|дﾟ)つ「このページでユーザーに何を
「前体の験しペてもーらうジ？」と次のページで
(゜-゜)ｺﾋﾟﾍﾟ・・・
何を体験する？」
前の
ページ
この
ページ
次の
ページ
|дﾟ)何があるー？ (゜-゜)ほすぃかきこφ(・ω・)ﾊﾟﾋﾟｺ
※フォーム

というわけでコイツの登場です。

サイトストラクチャ。
（サイト構造図orサイトマップ）
だんだんUIの話じゃなくなってきた・・・

家の設計と同じです
（知らんけど）

家ってこうでしょ（知らんけど）
使う人
どんな人が住みますか？
家族構成は？
生活スタイルは？
家（住宅）
の設計

使う人
家族構成は？
家（住宅）
の設計
設計図
どんな全体構造にしますか？
各部屋はどんな配置にしますか？

各部屋の設計
使う人
家族構成は？
家（住宅）
の設計
設計図
どんな部屋にしますか？
どんな配置にしますか？
どんなインテリアを置きますか？

各部屋の設計
Q.「この部屋、ドアってどっちにつければいい？」
使う人
家族構成は？
家（住宅）
の設計
設計図

各部屋の設計
Q.「この部屋、ドアってどっちにつければいい？」
使う人
家族構成は？
家（住宅）
の設計
設計図
A.「廊下がある方に決まってんだろうがああああ
ああああああああああああ(；ﾟДﾟ)」

Webサイトだって同じ。（知ら・・・知ってるよ！）
各部屋の設計
家族構成は？
設計図
使う人
使う人
どんな人が使いますか？
どんな使い方をしますか？
どんな目的を持った人ですか？
家（住宅）
の設計
Ｗｅｂサイト
の設計

各部屋の設計
家族構成は？
設計図
使う人
使う人
家（住宅）
の設計
Ｗｅｂサイト
の設計
サイト構造図

各部屋の設計
各部屋の設計
家族構成は？
設計図
使う人
サイト構造図
使う人
どんなデザインを置きますか？
家（住宅）
の設計
Ｗｅｂサイト
の設計

「グロナビ何にする・・・？」
「KVエリアなにいれる？」
「コンテンツエリアはどうする？」
画面構成を考える・・・？

「グロナビ何にする・・・？」
「KVのエリアなにいれる？」
このページだけで考えるのがマチガイ！！
ｽﾐﾏｾﾝ(*´з`) (ﾟДﾟ)ｺﾞﾙｧ!
「コンテンツエリアはどする？」

画面構成を考える前にその１
≡≡≡ﾍ(*ﾟ∇ﾟ)ﾉｻﾖﾅﾗｰ
三(・∀・)
「どこから来る？」
「どこから出る？」

画面構成を考える前にその２
(・∀・)
(・∀・)
「どういう塊で情報を見ていく？」
(・∀・)
ぐる
ぐる
ぐる
ぐる
(・∀・)
(・∀・)
ぐる(・∀・)
ぐる
ぐる
ぐる

画面構成を考える前にその３
(・∀・)
ﾅﾙﾎﾄﾞﾅ
「どのページから違うカテゴリへ移動す
る？」
三(・∀・)ｺｯﾁｰ
三(・∀・)ｺｯﾁﾔｰ
ｱｯﾁｰ(・∀・)三

たとえばこれがこうなります

「設計する前の大事なこと」たとえばこれがこうなります
グローバルナビ
ローカルナビ

次ステップへのリンク

コンバージョン導線
（アクションエリア）

グローバルナビ
関連リンク
ローカルナビ
コンバージョン導線

「UI設計」の主な範囲とは？

何を
1. 置くのか
どこに
2. 置くのか
どのように
だいたいココ
「UI設計」の主な範囲
まとめますわ
「UI設計」の主な範囲は

何を
1. 置くのか
どこに
2. 置くのか
どのように
だいたいココ
「UI設計」の主な範囲
まとめますわ
でもココだけ考えたって
答えなんかでやしねぇ

「設計する前の大事なこと」「UI設計」の主な範囲
まとめますわ
とっても大事なこと。
• ページのＵＸを考える
• その前に前後のＵＸを考える
• その前にサイト全体のＵＸを考える

「設計する前の大事なこと」「UI設計」の主な範囲
まとめますわ
とっても大事なこと。
忘れないでね( ´_ゝ`)
• ページのＵＸを考える
• その前に前後のＵＸを考える
• その前にサイト全体のＵＸを考える

０３．「UI設計」のいろんな事例
∧__∧
（ ´∀｀）やっと具体論だお
( O┬O
≡◎-ヽJ┴◎

というわけで実際のサイトを例に
ＵＩ設計的な何かを紹介したいと思います。
だってﾛｼﾞｯｸだけじゃつまらないﾃﾞｼｮ(´Д⊂ヽ
※ちなみに全部徳永の推測です。
本当にそうかどうかはわかりません。

知らないとは言わせない２つのサイト
Yahoo! Google
やほー
知らなかったらアナタはもぐり( ´_ゝ`)

知らないとは言わせない２つのサイト
ぜんぜんちがう・・・
→なぜ？(‘ω’)
Yahoo! Google
やほー

Yahoo!
• リンクいっぱい
• 機能（ツール）もいっぱい
• コンテンツもいっぱい
• 広告デカイ！
Yahoo!の場合

Yahoo!の場合
Yahoo!
• リンクいっぱい
• 機能（ツール）もいっぱい
• コンテンツもいっぱい
• 広告デカイ！
Yahoo!はメディアモデルなのです。

Google
Google大先生の場合
• リンク少ない
• 機能少ない
• コンテンツ・・・ない
• 広告・・・どこ？(；ﾟДﾟ)
潔いにもほどがある

Google
Google大先生の場合
• リンク少ない
• 機能少ない
• コンテンツ・・・ない
• 広告・・・どこ？(；ﾟДﾟ)
潔いにもほどがある
Googleはインフラモデルなのです。

何が違うかというと・・・
いっぱいサイト内に居てほしいとにかく検索してほしい

いっぱいサイト内に居てほしいとにかく検索してほしい
ビジネスモデルの違い

ゲーム開発会社の場合。
SCE 任天堂セガ

SCEの場合
SCE
• KVにPS4（ゲーム情報）
• でもほとんど企業情報
• コンテンツ部分も企業情報
• PS専用サイトが別にある

SCEの場合
SCE
• KVにPS4（ゲーム情報）
• でもほとんど企業情報
• コンテンツ部分も企業情報
• PS専用サイトが別にある
いわゆる一般的な「ゲーム会社のコーポレートサイト」？？

任天堂の場合
• 主力商品が全面に！
• ゲーム情報だらけ
• ファビコンまでマリオ
• 企業情報少ない
任天堂

任天堂の場合
• 主力商品が全面に！
• ゲーム情報だらけ
• ファビコンまでマリオ
• 企業情報少ない
任天堂
任天堂に求められているのは老若男女に対する
「ゲームのワクワク」ということ

セェェエガァアア♪じゃなくてセガの場合
セガ
• 「・・・ふぁっ？！」
• というほどにゲーム情報ない
• KVもゲームじゃない

セェェエガァアア♪じゃなくてセガの場合
セガ
• 「・・・ふぁっ？！」
• というほどにゲーム情報ない
• KVもゲームじゃない
セガはもう「普通の家庭用ゲーム開発会社」じゃないのです
（パチンコ、スロット、アミューズメント）

SCE 任天堂セガ
みんな知ってる！
わくわく！を提供
もはや家庭用ゲーム
じゃないぜ
知らない人多い
（”SCE”で検索する人は企業について知り
たい。ゲームなら”PS3”で検索する）

SCE 任天堂セガ
もはや家庭用ゲーム
じゃないぜ
みんな知ってる！
わくわく！を提供
知らない人多い
（”SCE”で検索する人は企業について知り
たい。ゲームなら”PS3”で検索する）
「事業ドメイン」と「認知度」の違い

ホテル・旅館チェーンの場合
星のや富士屋ホテルチェーン
東急ホテルズワシントンホテル

星のや
富士屋ホテルチェーン

星のや
富士屋ホテルチェーン
とりあえず見ろ！
話はそれからだ！
とりあえず見ｒ・・・
たくさん体験できるよ(-”-)

さくっと予約しろください

ブランドプロミスの違い

いろんな事例からわかることは？

と思ったけど、とくにない。
ま、まと、まとめ・・・
いやまあ、前章で話した通り
ビジネスやUXで変わるってことがわかればよいと思います。

０４．UI設計の手法と実践（パターン）
／￣￣￣￣￣＼
| おまいらも|
∩_∩ | |
（´ー`） < がんばると|
（） | |
| | | | いい|
（___）__）＼＿＿＿＿＿／

まずは手法。

手法その１：みんな大好き「ワイヤーフレーム」
※架空案件の資料です

って、実はこれじゃだめです。

名前がだめ。

名前がだめ。
• 「ワイヤーフレーム（モデル）」とは、本来３DCGのレンダリング形式
の名前です。
• 「ワイヤー」で「表現されたモデル」
• つまり「ワイヤーフレーム」だけだと何のドキュメントかまでは指して
いません。
• 「ビジネス文書」と言ってるのと同じレベル
• それは報告書？稟議書？送付状？

正しくは
「画面構成案ワイヤーフレーム」
他に「コンテンツワイヤーフレーム」なんかもある。

手法その２：ペーパープロトタイプ
• 手書きでつくる
• 素早くつくれる
• 手軽に修正できる
• その場でディスカッション
「http://blog.webtron.jp/archives/2011/08/000083.html」より

ここで要注意！

厳密には、手書き＝ペーパープロトタイプ
なわけではないです。

厳密には、手書き＝ペーパープロトタイプ
• 手書きワイヤー＝ペーパープロトタイプ×
なわけではないです。
• テストするための紙のワイヤー
＝ペーパープロトタイプ○
• できるディレクターがつくる紙のワイヤー
＝ペーパープロトタイプ(ｷﾘｯ

手法その３：ユーザエクスペリエンスフロー
（UXフロー）
 UXフローの仮説立案（手法）について
 ユーザーが迷わない構造を実現するために、サイト
内外でのユーザー行動の仮説を立てます
 ユーザーがどこで何を感じ、何を求めるのかを定義
します
 それぞれのタスク、状況で発生するニーズ、求めら
れるコンテンツを導き出します。
 UXフローによるWebサイト上の理想的なサービス設
計に対して、現状のWebサイトがどのような状態に
あるのかを検証し、改善案を導き出します
マンション購入を検討している
（知識あり＆なし）
サイトにたどり着く
ブランドについて調べる
マンション購入ノウハウを調べる
商品・サービスについて調べる
実際に商品を見る・体験する
問い合わせる
購入
検討
繰り返す
事例や感想について調べる
ＵＸフローはお客様（ユーザー）と企業の繋がりをスケッチした
関係図です。お客様に対して、いかに自社最高のサービスを提供
し、ゴールまで導くかを描いた満足体験のストーリーです。

手法その３：ユーザエクスペリエンスフロー
（UXフロー）
 UXフローの仮説立案（手法）について
 ユーザーが迷わない構造を実現するために、サイト
内外でのユーザー行動の仮説を立てます
 ユーザーがどこで何を感じ、何を求めるのかを定義
します
ユーザーとどこで出会い、どこで興味を持ち、どこでアクションを
 それぞれのタスク、状況で発生するニーズ、求めら
れるコンテンツを導き出します。
起こしてもらうのかをフロー図にしたもの。
自社最高の満足体験をフローにしたもの。
 本プロジェクトでは、UXフローによるWebサイト上
の理想的なサービス設計に対して、現状のWebサイ
トがどのような状態にあるのかを検証し、改善案を
導き出します
マンション購入を検討している
（知識あり＆なし）
サイトにたどり着く
ブリリアについて調べる
マンション購入ノウハウを調べる
商品・サービスについて調べる
実際に商品を見る・体験する
問い合わせる
購入
検討
繰り返す
事例や感想について調べる
ＵＸフローはお客様（ユーザー）と企業の繋がりをスケッチした
関係図です。お客様に対して、いかに自社最高のサービスを提供
し、ゴールまで導くかを描いた満足体験のストーリーです。

手法その他：ほかにこんなものがあります。
• カスタマージャーニーマップ
• ペルソナ/シナリオ法
• アクティングアウト（厳密には設計じゃなくてテスト手法）
• プロトコル分析（厳密には設計じゃなくてテスト手法）
• モックアップ

続いて実践（パターン）。

といいつつ、事前の話の通り、
具体的なパターンみたいのはやめときます。
（調べりゃわかるので）

一応、基本的なナビゲーションパターン
•機能ナビゲーション
•階層型ナビゲーション
（グローバル、ローカルなど）
•パンくずナビゲーション
•ダイナミックナビゲーション
•ダイレクトナビゲーション
•ステップナビゲーション
（参照元：書籍「IA100」より）

気になるようだったら調べてみてください
一応、基本的なナビゲーションパターン
（グローバル、ローカルなど）
（参照元：書籍「IA100」より）

手法と実践の話をしましたが。

UI設計の手法と実践のまとめ
•ワイヤーフレーム
•ペーパープロトタイプ
•UXフロー
•カスタマージャーニーマップ

•UXフロー
手法パターン

手法パターン
•UXフロー
・・・これだと当てずっぽうになっちゃうので。

というわけで全体のまとめ。

まとめると何が言いたいかというと
1. UI設計は天才の所業ではないのです
2. ０２．「UI設計」の主な範囲と「設計する前の大事なこと」
この２つで話してきたこと

2. ０２．「UI設計」の主な範囲と「設計する前の大事なこと」
ビジネス側をみてぇー、
ユーザーの行動をみてぇ、
前後の関係性をみてぇー、
優先順位を考えてぇー、

これは「ロジック」ですね。
2. 「UI設計」の主な範囲と「それ以外」
ビジネス側をみてぇー、
ユーザーの行動をみてぇ、
前後の関係性をみてぇー、
優先順位を考えてぇー、

つまり。
つまり
つーーーまーーーり
ｺﾋﾟﾍﾟ(・∀・)ｺﾋﾟﾍﾟ

UI設計の基本は
ロジック
手法パターン
なのです。

だから、最後に言いたいこと。
•「んん～・・っ！こうだ！」とかっていきなり出すものでもない
•そのページだけでお絵かきするものでもない
•だから鍛錬をつめばある程度までは誰だってたどり着ける
•そもそも徳永は美的センスがない（泣）
•でも、日々「ロジック」と「手法」と「パターン」
を磨けば、ある程度はできるようになるのです。

ここから先はオマケ（時間があればやります）
興味がある人はあとで読んでみてください。

おまけ
おまけ１：UI設計能力を向上させるには

おまけ
UI設計能力を向上させるには
１．たくさんつくる

おまけ
２．たくさんサイトを見る

おまけ
３．ユーザー体験を重ねる

おまけ
タッチパネル接客（サービス）銀行とか手続き
※クロスドリーム、「CROSS i(クロスアイ)」

おまけ
タッチパネル接客（サービス）銀行とか手続き
※クロスドリーム、「CROSS i(クロスアイ)」
いつだって「ユーザー体験」

おまけ
４．○○に学ぶ

おまけ
ﾅﾝﾄｶｶﾝﾄｶ株式会社沿革
2000年6月創立。
創業者：軟渡寛治が当時フリーター
だった関都海斗とﾅﾝｶﾝ有限会社起業。
軟渡が初代社長就任に。その後すぐに
現役員の丸山が合流。2003年4月に洗
濯機、食洗器の取り扱いを開始。
2005年3月問題解決型家政婦「市原」
を提供開始。2006年7月現住所へ本社
移転（東京都港区西新橋3-24-9 飯田ビ
ル3F）2010年7月ISMS（情報セキュ
リティマネジメントシステム）
ISO27001:2005の認証を取得。
2014年11月代表取締役変更。関都海
斗が社長に就任。軟渡寛治の甥の妻の
姉である夜蔵北未が外部顧問として参
画
読む気しねぇ( ﾟДﾟ)
※社名・沿革すべて適当です

おまけ
どこに何が書いてある
かわかるようになった
(*’▽’)
でもつまんねぇ
( ﾟДﾟ)ﾖﾐﾀｸﾈｪ
ﾅﾝﾄｶｶﾝﾄｶ株式会社沿革
■2000年6月
創業者：軟渡寛治が当時フリーター
だった関都海斗とﾅﾝｶﾝ有限会社起業。
軟渡が初代社長就任に。その後すぐに
現役員の丸山が合流。
■2003年4月
洗濯機、食洗器の取り扱いを開始。
■2005年3月
問題解決型家政婦「市原」を提供開始。
■2006年7月
現住所へ本社移転（東京都港区西新橋
3-24-9 飯田ビル3F）
■2014年11月
代表取締役変更。関都海斗が社長に就
任。軟渡寛治の甥の妻の姉である夜蔵
北未が外部顧※問社と名し・て沿参革画すべて適当です

おまけ
インテリジェントネットの歴史
■2000年6月創立。
岡健太郎さんが和田嘉弘さんを若手に
起業。円城均さんが初代社長に。すぐ
に石丸さん石川さん合流。
■2005年4月
Googleアドワーズ広告、オーバーチュ
ア広告（現Yahoo!リスティング広告）
の取り扱いを開始。
■2006年3月ASP型アクセス解析
「PYXIS」を開始。2006年6月現住所
へ本社移転（東京都港区西新橋3-24-9
飯田ビル3F）
■2011年6月
ISMS（情報セキュリティマネジメント
システム）ISO27001:2005の認証を取
得。
どこに何が書いてある
かわかるようになった
(*’▽’)
じゃあこれならどう？
でもつまんねぇ
( ﾟДﾟ)ﾖﾐﾀｸﾈｪ

おまけ
(ﾟωﾟ)ﾎｩ・・・
ﾅﾝﾄｶｶﾝﾄｶ株式会社の歴史
■軟渡氏。ダイヤの原石「ｶﾝﾄ」を発見
2000年6月創業。
軟渡寛治が当時フリーターだった関都
海斗とﾅﾝｶﾝ有限会社起業。軟渡が初代
社長就任に。その後すぐに現役員の丸
山が合流。
■なぜか「洗い物」事業に
洗濯機、食洗器の取り扱いを開始。
■さらになぜか「人」を送り込む
問題解決型家政婦「市原」を提供開始。
■当然、手狭になりまして
現住所へ本社移転（東京都港区西新橋
3-24-9 飯田ビル3F）
■原石がダイヤに。そしてコネ採用
代表取締役変更。関都海斗が社長に就
任。軟渡寛治の甥の妻の姉である夜蔵
北未が外部顧問として参画
※社名・沿革すべて適当です

おまけ
４．雑誌に学ぶ

おまけ
雑誌には学ぶところが
たくさんあります。
•テンプレートという考え方
•文書構造という考え方
•文章の割り付け
•何よりも見出しの付け方

おまけ
もちろん雑誌だけじゃないです
雑誌には学ぶところが
たくさんあります。
•テンプレートという考え方
•文書構造という考え方
•文章の割り付け
•何よりも見出しの付け方

おまけ
を、まとめると。

おまけ
つまり亀仙流である

おまけ
こういうこと。

おまけ
以上ですありがとうございました。
インテリジェントネット株式会社
http://www.ini.co.jp/
インテリジェントネットFacebook
https://www.facebook.com/intelligentnet

UI設計の土台になる考え方-インテリジェントネット社内勉強会

Recommandé

Recommandé

Contenu connexe

Tendances

Tendances (20)

En vedette

En vedette (20)

Similaire à UI設計の土台になる考え方-インテリジェントネット社内勉強会

Similaire à UI設計の土台になる考え方-インテリジェントネット社内勉強会 (20)

UI設計の土台になる考え方-インテリジェントネット社内勉強会