瞬間と永遠.com 自分を探し自分を知るブログ@愛知県豊田市・名古屋市 > つたえる > Webサイト制作フローに、a-blog cms とプロトタイプを取り入れ、クライアントのUXを高めよう! > Web

Webサイト制作フローに、a-blog cms とプロトタイプを取り入れ、クライアントのUXを高めよう!

選択されているタグ

タグを絞り込む

a-blog cms Advent Calendar 2013の12/14を担当いたします、ミズノケイスケと申しますm(._.)m

Web制作に、a-blog cms(またはその他のCMS)とプロトタイプの考え方を取り入れよう、というのはすでに珍しくない話かと思いますが、知らない方もいると思ったので書いてみます。特にWebディレクターさん、小規模・少人数でサイト制作をしているかた!この手法は取り入れなければ損ですよ〜。

タイトル釣りでスミマセンのお詫び

「クライアントのUXを高めよう!」なんて書いちゃいました。「UX」を間違って使った例ですが、ちょっと「釣り」というか、確信犯(これも厳密には誤用ですが)なタイトルです(汗)つまり、Webサイト制作に「プロトタイプ」を導入すると、効率だけでなく「クライアントに対して価値ある体験」を提供できる。ということが言いたいのでした。

さらに、「直感的」とか「わかりやすい」という「一時的UX」(誤用)だけでなく、Webサイトの成果にもつながり、今後のクライアントの関係もよくなるという「累積的UX」(誤用)も提供できるというメリットがあります。はい。

思えば3年前、ピカピカのWebディレクション1年生

2010年の8月末だから、3年も前だ!マークアップエンジニアをしていた僕は、このころ初ディレクションを経験しました。そしてその時、こんなエントリーを書いています。

HCD × a-blog cms で、コンテンツから作るウェブサイトを考えてみた | 頭ん中 | 瞬間と永遠.com

実践も検証もしていない分けですから、今からすれば粗削りなところだらけですが、基本的な思想はそのまま、ああ、脈々と受け継がれているんだなあ〜、と感じました。

現在のミズノのフロー

さて本題です。「a-blog cms × プロトタイプ」を具体的にどう実践しているか?

ここで、リスト番号をつけて「1、2、3、4・・・・」と書こうとして、あれ・・?どういう順番でやっているんだっけ??

そうなんです!順番通り(それこそウォーターフォール)になっていないからこそのプロトタイプなのですね!(と、自分で納得。。)いわゆる「陶芸的」「こね上げて作り上げる」この表現をここのところ使うのですが、行ったり来たり、こねては削り、時に壊し。を繰り返して作っているようです。

これでは抽象的すぎるので、リスト番号をつけることにチャレンジしてみます。。

  1. ヒアリングにより、コンセプト的なこととか要件定義的なことをまとめる。(まとめる→営業担当に確認→クライアントに確認→修正・・・)
  2. サイトの企画的なこと。情報設計やサイトマップ作成。ペーパープロトタイプ作成。必要な機能に想いを巡らす。(ここでも小出しにして評価をもらう)
  3. a-blog cms をインストールし、既存のテーマでサイト作成。情報を整理しカテゴリやエントリー追加→原稿をざっくり入れていく。
  4. a-blog cms の機能的な部分をカスタマイズ。(HTMLをいじってモジュールやカスタムフィールドなどを追加)
  5. 機能やコンテンツ的にOKが出たプロトタイプを元に、ワイヤーフレーム作成→ビジュアルデザイン。
  6. プロトタイプをCSSで装飾して完成!

おおざっぱにまとめれば、上記のようになっているはずです。

その他、ポイントは以下のもの。

  • 行程は行ったり来たりを繰り返す(必ずしも一方通行ではない)
  • クライアントへは小出しに見ていただき評価をもらう(できればターゲットユーザーの評価も欲しいなあ)

評判の程は?

クライアントの声や、所感を書いてみます。

「イメージしやすい、わかりやすい」という声もあれば、「イメージがまったく沸かない」という方もいる。クライアントの性質によるものと思われます。(論理派 or 感覚派など)

そうそう忘れるところでした、表題に「クライアントのUX」(誤用)と書いたように、「楽しい!」と言っていただけることが多いです。その理由としては「参加できる」点にあるのではないでしょうか?CMSをインストールした地点から触ることができるのが、このフローのメリットです。

ビジュアルとコンテンツを切り離すことができる。最初は「かっこいいデザインにしたい!」と言っている方でも、装飾のないプロトタイプで進めることにより、「ああ、大事なのは見た目じゃなくて内容なんだ」って、思っていただける。(場合もある^^;)

その他、皆さんの参考エントリー

プロトタイプ関連のエントリーを集めたので、ご参考にしてください。

以上、ぜひお試し下さい(、`)ノ


--

※この記事を書いた人、ミズノケイスケに興味を持っていただけましたら、ミズノのFacebookをフォローください(一番更新頻度が高いです!)

お知らせ:ミズノケイスケは、2015年5月ポエジーという屋号でフリーランスとして開業しました。詳しくは以下をご覧ください。



「今の自分を知る言葉・変える言葉」みんなのアイデンティティコンセプトと感想を見る

今の自分を知る言葉アイデンティティコンセプトを3時間でつくるセッション受付中言葉にすることで前進するちょっと変わったコーチング5,000円/1時間(税別)

やりたいことがやりたくて独立起業したはずなのに、なぜかやりたいことができていないフリーランスのための個別授業

豊田市で成果の出るホームページ制作をしています。
1.わかりやすく 2.その会社らしく 3.美しい ホームページを約束します ⇒詳しくはクリック!

この記事に関連する記事

コメント

投稿
名前
 
メールアドレス
 
URL
 
タイトル
コメント
パスワード
Cookieに保存

瞬間と永遠.com 自分を探し自分を知るブログ@愛知県豊田市・名古屋市 > つたえる > Webサイト制作フローに、a-blog cms とプロトタイプを取り入れ、クライアントのUXを高めよう! > Web

RSS 購読
リンク
  • track feed 瞬間と永遠.com

↑PAGE TOP