アークウェブ
Webデザイン
SandBox
Web制作会社アークウェブのスタッフが、デザインのTips・ノウハウをまとめているWikiです
アークウェブシステム開発SandBox
アークウェブWebマーケティングSandBox
アークウェブWebデザインSandBox
アークウェブ アクセシビリティWiki
http://www.ark-web.jp/sandbox/design/wiki/2214.html
[
トップ
] [
編集
|
差分
|
バックアップ
|
添付
|
リロード
] [
新規
|
一覧
|
単語検索
|
最終更新
|
ヘルプ
]
-- 雛形とするページ --
Adobe MAX Japan 2009 2日目レポート
Ajax/角丸ライブラリ
AsEventListener
ComponentExplorer
Flex/Flash Catalyst βを試す
FormatDate
FrontPage
Google Browser Size でファーストビューをチェック
InterWikiName
JavaScript
MT/管理画面/テンプレートのオーバーライド
MenuBar
PHP
PukiWiki
RecentDeleted
SandBox
WebデザイナーにもわかるFlex画面デザイン(1)
WebデザイナーにもわかるFlex画面デザイン(2)
WebデザイナーにもわかるFlex画面デザイン(3)
WebデザイナーにもわかるFlex画面デザイン(4)
WebデザイナーにもわかるFlex画面デザイン(5)
WikiName
WikiWikiWeb
YukiWiki
Zen Cart/tips
event/POINT OF VIEW 第0回
event/インクルーシブデザインワークショップ
iPad/iPadにだけCSS付与するには
jQuery
jQuery/ECサイトで使ってみたいプラグイン
tag
イテレーション1
サンプル
タグ/PGP
パフォーマンス改善/Bookmark
ヘルプ
志田
小沼
進地
整形ルール
斉藤
大家メモ
大家メモ/MAMP/MAMP環境でのPHPエラー表示
大家メモ/MAMP/Mac OSXローカルにMAMPでサイト制作環境を構築
竹村
中野
日本語
八木
勉強会
勉強会/アクセシビリティ勉強会@2008.01.29
勉強会/アクセシビリティ勉強会@2008.01.22
** インクルーシブデザインとは? [#yd80b49c] - 「高齢者や障害のある人など、特別なニーズを抱えた消費者をデザインプロセスの上流工程へと積極的に巻き込んでいく手法」(京都大学インクルーシブデザインユニットWebサイトより) - インクルーシブ=巻き込む -- みんなを巻き込む -- 「ユーザ巻き込み型デザイン」 - デザイナー1人でつくるのではなく、みんなで考えるデザイン - ユニバーサルデザインの手法のひとつ。
タイムスタンプを変更しない
#topicpath * インクルーシブデザインワークショップに参加してみました [#ld574813] 小森です。 12月5日、つくば市で開催されたインクルーシブデザインワークショップ http://tsukuba-cu.net/course_eventlist/2009/12/post-33.html に参加してきました。 講師は京都大学の塩瀬隆之さんで、笑いと写真と具体例を交えてのとても面白い内容で、 個人的には、目からうろこがボロボロ落ちた気がしました。 ほとんどメモではありますが、気づきが多かったので、ここに残したいと思います。 京都大学インクルーシブデザインユニット http://www.museum.kyoto-u.ac.jp/inclusive/ ** インクルーシブデザインとは? [#yd80b49c] - 「高齢者や障害のある人など、特別なニーズを抱えた消費者をデザインプロセスの上流工程へと積極的に巻き込んでいく手法」(京都大学インクルーシブデザインユニットWebサイトより) - インクルーシブ=巻き込む -- みんなを巻き込む -- 「ユーザ巻き込み型デザイン」 - デザイナー1人でつくるのではなく、みんなで考えるデザイン - ユニバーサルデザインの手法のひとつ。 **「みんなをまきこむ動物園」の事例 [#r13c3e36] - 京都市の動物園をインクルーシブデザインで改善案(賞をとったそうです) -- http://www.city.kyoto.lg.jp/hokenfukushi/page/0000071906.html -- (PDF)http://www.city.kyoto.lg.jp/hokenfukushi/cmsfiles/contents/0000051/51996/06gakusei.pdf *** すすめかた [#z27ed653] リードユーザ(障害者)と一緒に動物園を歩きながら、 その振る舞いや言葉など、気づいたことを付箋に書く (とにかく記録に残すことが大事) ↓ 付箋をグルーピング ↓ 絵を書く ↓ 試作品を「すぐ」つくる - 調査と観察でオワリ、でなく''プロトタイピングまでの全工程にユーザが参加''する - (調査工程の)一発で答え=言葉は出ないから (IDEOのやりかたに似てるな、と思ったけど、最後までユーザが参加するというところが違う) ** ユニバーサルデザインはなぜうまくいかないか? [#bbeaffc8] - 実際には不便な商品 - 遠回りする点字ブロック - かっこわるい障害者向けデザイン... なぜこうなるか? ↓ ''&color(red){「他人ごとだから」};'' - 疑似体験しても「かわいそう」「助けなければ」という感想にしかならない - 「将来自分もこうなる」は遠すぎて実感がない - ユニバーサル=「みんなが使える」→「○○の人が使える」、から始めるとうまくいかない ** 個人からはじめるアプローチ [#x7b241da] - ある個人のユーザのニーズをつきつめて、広げていく -- 車椅子を改善するとベビーカーにも応用できる -- 片手が不自由な人に対応すると、雨で傘をさしている人にも便利 - ''○○さんのために'' ではなく、 &color(red){''○○さんとともに''}; という考え方に。 ** なぜデザインが大事か? [#k6f64777] - 障害者 disable → disabled、と呼び方が変わった - ''デザインが悪い、という考え方'' - ''デザインが人を排除している''(=exclusive) - 冷蔵庫の話。 -- たとえば、車椅子の人が冷蔵庫を開けるとき、どうなってしまうか? →扉にぶつかってしまう。開けると同時に下がらないといけない -- 健常者は、無意識のうちに一歩下がっている。 -- ''デザインに動きを強制されている。'' - 障害者向け商品はデザインがいまいち - 他人が使うと思っているから、かっこわるいデザインでも平気になってしまう。 →''自分の家にあってもいいもの、欲しくなるデザインをつくる'' ** ワークショップ [#e4b35bc4] 今回のお題は「使いやすいバンドエイド」。 私たちのテーブルでは視覚障害者の方がリードユーザになって、市販のバンドエイドを使ってもらい、 書く(問題点の洗い出し)→ 描く(アイディア、商品名)→ 作る(プロトタイプ制作)→ 見せる(プレゼン) を行ないました。 以下のような問題点があがりました。 - (箱が複数あった)商品の違いがわからない - 箱の開ける場所をみつけにくい -- 袋の開け口を粘着テープで留めたタイプのものは、相当苦労していた - 内袋が空けにくい - シールをとりにくい - 傷の場所を手で探すために、傷口に触ってしまう - 内袋やシールが多くてゴミが出る - ... 改善案を出し、その場で紙とはさみを使っての試作品を試してもらって、商品名もつけます。 私たちのグループは各問題ごとに箱の改善案、本体の改善案、と細かい改善視点での試作を進めていたのですが、他のグループからは、 - セロテープのような形状のバンドエイド - 折りたたんだ紙に貼ってあるバンドエイド(=ペロっとはがすだけで使える。ごみは出ない) といった包括した面白いアイディアが出てました。 自分が片手を怪我していたら、と片手で使ってみたり、あれこれ雑談や冗談を言いながら、障害のあるなしや年齢関係なく意見を出し合い、同じで立場で進めることができたと思います。 ** 感想 [#z71a27f7] 印象に残ったキーワードなど。 *** 「ユーザは絞り込んでいくのではなく広げていくもの」 [#ua9d71c2] 通常、私たちがウェブをつくるときは「ターゲットユーザは絞り込むもの」という考え方から始めますが、 - まず、具体的な「隣のだれか」を幸せにすることを考える - そこから対象を広げていく(「あ、この機能は健常者にとっても便利だよね?」) という考え方が新鮮でした。 (「ペルソナ」の考え方に近いかもしれません) *** デザインが悪い、という考え方 [#l076c2e4] - 障害者は操作に詰まったとき自分が悪い、と思って質問しなかったり使わなくなってしまう。という話を思い出した。 - ひとが罪悪感を感じさせないデザインにするべきだ、と思った。 *** 「これ」「あれ」 [#e747f181] - ワークショップ中、気づかないうちに「こうしよう」「これでいいんじゃない?」と、普段から指示代名詞をいかに使っているか。 -- え、どうなったの?え、どれ?と視覚障害のリードユーザに何度も聞かれてしまった。 *** Webだとどうだろう? [#p17c7352] 自分の仕事に置き換えて、ウェブアクセシビリティにどう反映できるか?と考えると、 - アクセシビリティ専用のページを作らないとダメだよ、と弱気になるときもあったけれど、 「アクセシビリティは一般の人にもやさしい」、と発想を変える - アクセシビリティ=どんな人にも、どんな障害の人にも、と大上段に考えると大きすぎて動けなくなる。 できることからやればいいんだ、と気が楽になった - 「ワカッタ気にならないこと」 -- 講義の最初に、参加者全員で何も見ずに「シマウマ」を描いてください、と言われました。 当然知っているつもりだけど、案外描けないもので、私が描いたシマウマは、トラ模様のなんかおかしなシマウマになってしまいました。 続いて同じグループの人にヒントをもらいながら描く、ということをやったのですが、「後ろ足の縞が山になっている」というヒントも、私は「▲」で描いたが、実際の写真を見ると「人」の形状だったり、「伝えることの難しさ」を実感。 -- たとえば動物園に行ったら、知っているつもりで通り過ぎてしまうでしょう。でも、よく見ないと知らないことがたくさんある。 -- 同じように、Webをワカッタつもりでいるのはあやうい。 *** 笑いや手を動かしながらだと、印象に残りやすい [#x188a290] - このワークショップに限らないですが、 体験しながら、五感を使いながらだと頭にも心にも入っていきやすいですね。 うーん、このメモだと面白さがちっとも伝わらない気がしますが、機会があればいろんな人にぜひ体験してみてほしいです。 #blikifooter(小森)
テキスト整形のルールを表示する
アークウェブのサービスやソリューションはこちら
サービス
Webの企画・戦略立案
Webデザイン
Webシステム開発
Zen Cartソリューション
Zen Cart導入コンサルティング, RFP作成, トラブル診断
Zen Cartで大規模ECサイト構築
Zen Cartモジュールの開発・カスタマイズ
Zen Cart制作会社(デザイン・企画会社)様向けサービス
Zen Cart海外向け・多言語ECサイトの制作
Zen Cartのデザイン, ペルソナ/シナリオ法, RIA(Ajax・Flex)
Zen Cartのセキュリティ・運用保守サポート
Zen Cart企画・マーケティング戦略, SEO・SEM(サーチエンジン広告)
Zen Cartハイエンド版(大規模サイト用高可用バージョン)
EC-CUBEとZen Cart 機能比較表(概要)
Zen Cart携帯モジュール(モバイルショップ構築用)
Zen Cartの導入事例
Zen-Cart.JPのご紹介とアークウェブの取り組み
Zen-Cartモバイルショップ構築サービス
Movable Typeソリューション
企業サイトでのMovable Type活用
Movable Type用プラグイン一覧
MT用フォーム作成プラグイン「A-Form」
A-Formパートナー制度
その他ソリューション
AjaxでRIA開発
Ruby on Rails
Flexによる業務システム構築
ペルソナ/シナリオ法
ビジネスブログ
SNS・ソーシャルソフトウェア
SEO・SEM
アークウェブのCSR(企業の社会的責任)
アークウェブのCSR指針