2010年7月27日火曜日

第15週 最終発表




今週は、いよいよ最終発表です。

富士通から2名のお客様が来ていただき審査をしていただきました。
発表前に、お話いただきました。
富士通ではインターンがあと2回あるので皆さん是非応募しましょう。

[発表の様子]


使用シーンをわかりやすく演じるアクティングアウトで会場が湧く。








ここで今日一番の盛り上がりに・・・





[連絡]
8月2日(月)12:30までに山崎研前にポートフォリオを提出してください。
この授業の最後の採点対象の提出物なので本日のアドバイスも反映し、完成度の高いポートフォリオを提出してください。

2010年7月20日火曜日

第14週 プロトタイプ発表・提出









今週は「プロトタイプ発表・提出」でした。

まず、最初に去年度の事例を紹介
ポイント:最初にロゴと製品のイメージを示す。(どんなものか最初にわかることは重要。)
自分がやっているものはどのようなものかを提示する。
プロダクト、インターフェースのコンセプトをそれぞれ発表にいれる。

次に先輩のポートフォリオ紹介。
先輩による直々の説明。


先輩のポートフォリオを参考にし、8月2日のポートフォリオ提出に備える。


[連絡事項]
・8月2日のポートフォリオ提出はA3タテ

2010年7月13日火曜日

第13週 最終構造・画面発表





今週は「最終構造・画面発表」でした。
前回のインターフェース中間のプリントアウトを持参し、それに対してアドバイスをもらう。
各自のインターフェースやその他のデザインの課題についてアドバイスをもらう。
もう一度自分のデザインのポイントがどこにあるか考える必要があるようです。





[最終発表の発表内容]
①パワーポイントによる発表(2分程度)
・テーマ、グループ名、メンバー名
・代表的なフォトエッセイとフォトダイアリーと気づき
・デザインコンセプト(プロダクトとインターフェース)
・対象ユーザーとシナリオ、シーンスケッチ
・プロダクトレンダリング(イラレまたは3D)
・情報構造図(サイトアーキテクチャ)
・代表的な画面(イラレ)

②アクティングアウトによる発表(1分程度)
・もっとも魅力的なシナリオに沿って、演じる
・背景に画面のアニメーション(Flash)を見せる
・最後にプロダクトのプロトタイプを見せる。


初めて見る人にもわかりやすく、魅力をアピールする。

2010年7月6日火曜日

第12週 インターフェイス中間発表






今日はインターフェイスの中間発表です。

発表内容は以下の通りです。
1.インターフェイスの提供価値
2.構造図
3.提供シナリオ
4.ユーザーフロー図
5.アクティングでシーンをプレゼン

以下はコメントです。
・サイト構造図、ユーザーフロー図は前回の授業からレベルアップしてます。
・実際にビジュアル化したときの魅力が足りません。
・ワイヤーフレームのスケッチの時点でもっとアイデア出しをしましょう。
・画面デザインにも視覚的に特徴を持たせられるようにデザインしましょう。
・自分のアイデアをわかりやすく伝えられるようにプレゼンにも気を配りましょう。
・インターフェイスデザインになりましたが、プロダクトのブラッシュアップも行いましょう。
・画面デザインをただ文字を表示する岳の人が多いように思えます。もう少し、きれいで見て使いたくなるようなデザインを目指しましょう。
・アクティングアウトで本格的に演技をした方が魅力が十分に伝わります。
・自分の提案が本当に約に立つ魅力的な提案なのかを検討してください。

・操作に対しての反応が見えてくるデザインがgood
・シーンから操作部の最適な場所を決定しよう。


[山崎先生]
あと3週間で最終発表です。最後の週はプレゼンを良くする練習に使う。
画面の作り込み、必要な画面が全部ない
最終発表でどういうシナリオで発表するのかを考える。自分の見せたいことをしっかり整理する。それに必要な画面作りをがんばる。
最終発表に向けて画面一つ一つの完成度を高める。
フラッシュ苦手な人はパワーポイントでもアニメーションがつけられるから、それらを利用する。

[中本先生]
最終発表の流れを考える。自分のオリジナリティのある部分を見せる。
①メニュー画面
②自分のオリジナリティのある画面
少なくとも、この2つの方向の画面が作成できる。


来週は最終発表に向けた代表的な画面をプリントアウトで持ってくる。

2010年6月29日火曜日

第11週 画面スケッチ発表・企業での事例






今週は「画面スケッチ発表・企業での事例」でした。

最初はサイト構成図やユーザーフローのおさらいを含めた山崎先生による指導。
その後、昨年の授業の最終プレゼン資料を見ながら山崎先生による説明を受けました。



最終発表では
・フラッシュでアクティングアウト
・ムービーを作る
という方法の二つがある。ムービーの方が本番緊張しないでいい。

次回は発表。1人3分
①パワーポイント発表
 ・3つの基本シナリオ
 ・情報構造図(サイトアーキテクチャ)
 ・ユーザーフロー図
②アクティン グアウトと画面デザイン
 ・もっとも魅力的なユーザーシナリオに沿って、インターフェースの魅力をアピールする。
 ・ユーザーシナリオに 沿って、各画面を見せながら、アクティングアウトをする。
 ・各画面は、ペーパープロトまたは画面デザイン
 ・アクティングアウトはチー ムメンバーと協力する




その後は山崎、石田班と中本、三丸班に別れて画面デザインに重点をおいてアドバイスを受ける。

次週はデータを12:00~13:00の間に山崎研究室に提出しに来てください。

2010年6月22日火曜日

第10週 ユーザー評価結果発表


今週はユーザー評価結果発表でした。
前半はインターフェースの検討を行いました。
半分はIA(情報アーキテクチャ)についての話。


[前半の連絡事項]
・今週から情報インターフェースに突入
・再来週に情報インターフェースの中間なので、それに向けてがんばる。
(一人3分。画面デザインとアクティングアウト)
・インターフェースは情報アーキテクチャを考える。見えない部分が重要になってくる。
・サイト構成図、ワイヤーフレームを作ってくる。


[来週までの課題(レポート形式)]
下記を14:50までに提出
①3つの基本シナリオを作る
 ・画面のインターフェースを考慮したシナリオにする
 ・インターフェースとして魅力的な部分を入れる。
②3つの基本シナリオを考慮しサイト構造図(サイトマップ)を作る。
③代表的なシナリオに沿って、各画面のワイヤーフレーム(または画面スケッチ)を作る。


[7/6 情報インターフェース中間発表:発表内容(一人3分)]
①パワーポイント発表
 ・3つの基本シナリオ
 ・情報構造図(サイトアーキテクチャ)
 ・ユーザーフロー図
②アクティングアウトと画面デザイン
 ・もっとも魅力的なユーザーシナリオに沿って、インターフェースの魅力をアピールする。
 ・ユーザーシナリオに沿って、各画面を見せながら、アクティングアウトをする。
 ・各画面は、ペーパープロトまたは画面デザイン
 ・アクティングアウトはチームメンバーと協力する


[情報アーキテクチャ]
複雑で分かりにくい情報をわかりやすくする考え方、技術

ユーザーエクスペリエンス
=テクノロジー+ビジュアルコミュニケーション+情報アーキテクチャ
表面的にはわかりにくいが情報アーキテクチャはデザインにおいて重要。
「IA100」情報アーキテクチャでのおすすめの本


[コンセプト]
ユーザーにとってのデザインコンセプト
        +
モノにとってのデザインコンセプト

以上の二つの方向からコンセプトを検討。




[サイトコンセプト]
・ユーザーシナリオ(ストーリーボード)
・ユーザーフロー(ユーザーが使用する、操作する順番)
・コンセプトダイアグラム


[サイトストラクチャー]
サイトの構造、骨格

[ナビゲーション]
他のページにつながる道筋。
「グローバルナビゲーション」「ローカルナビゲーション」などがある

建築の平面図と似てる。
グローバルエリア(どこのページに行っても共通で見える部分)
コンテンツエリア(実際にみる部分)
ローカルエリア(分野:例えば商品や製品)
グローバルエリアの例:アマゾン

グローバルとローカルはボタンがあって、そこから違うページに飛ぶ。

[ラベル設計]
名前の付け方
製品?商品?プロダクト?どう呼んだらユーザーはわかりやすいか
完結に
(例:アップルのホームページ「ストア」)


[ワイヤーフレーム]
建築でいう家のレイアウト図
これを来週までにやってくる。



------------------------------------------------------
後半はスナミさんによるプロトタイプの講演

プロトタイプの意味
 ・形状を確認
 ・短時間、低コスト
 ・ハンドツールの検証に非常に有効

デザインモックアップの手法
 ・曲面が多いもの
 ・平面が多いもの(スチレンボード:削りやすい、ボリュームがだしやすい。プラバン)
 ・細い(プラ棒、針金)

スタイロフォームを使ったプロトタイプ
 スタイロフォーム=断熱材(大きくて安い)
①買ってくる
②カットする
 ポイント:カッターを長く出す。刺身を切るイメージで切る。
③接着する
 スチのりで接着
④接着面を固定
 マスキングテープなどで固定する。
⑤アウトラインを書く
 三面図で各面に書く。(ここ重要!!/山崎先生)

⑥荒取り
 ここでもカッターの刃を長く出す。Vカットを何度も繰り返す。
⑦荒取り完成
⑧荒削り
 サンドペーパーで荒取りで取れなかったところを削る。
 内側はサンドペーパーを丸める。曲線面などは丸める。完成
⑨下地作り
 モデリングペーストを使用。(アクリル画で使うモノ。)ヘラで最初はべたべたぬる。
 ケーキにクリームをぬるイメージ。持つところがなくなったら、棒などを刺す。
⑩乾燥したら削る
 再びサンドペーパーで削る。凹みは棒の周りにサンドペーパーを巻き削る。
 平面を削るにはサンドペーパーを机に固定させモックの方を動かす。
⑪徐々にサンドペーパーを細かいモノに
⑫サーフェーサーを吹く
 細かい凹凸を吸収してくれる。凹凸が浮き出る。注)模型用を買う。(車用は粒子が荒い)
⑬耐水ペーパーで磨く
 水につけて磨く、非常に細かいペーパー
⑭再度サーフェーサーを吹き、下地完成。
⑮塗装する
 ここでも模型用を買う。
⑯ラインテープを張る
⑰下側を塗る
 今回はアクリルで塗装。乾く前に塗る。水をぬる感覚で。→乾燥させる
⑱部品の取り付け
 既製品で使える部品は使うと完成度が上がる。今回はマウスなのでUSBのケーブルなど

参考文献
グラフィック社 「モデリングテクニック」

オマケ
RP機(ラビットプロトタイピング)
3Dプリンター

3D CAD
3D CG

STLファイル

光造形
溶解積層
粉末積層

仕上げ



参考文献
日刊工業新聞社「絵ときでわかる3次元CAD」

2010年6月15日火曜日

第9週 情報プロダクト最終発表






今週は情報プロダクト最終発表でした。

企業からのゲスト審査員として、富士通の方に来ていただきました。


発表は一人3分。
①はじめにテーマ、コンセプト→最終形のイメージ 模型、CG
(気づき、誰のため、どういうこと)
②対象ユーザー、シナリオ、気づき、コ ンセプト
③スケッチ、CG、模型
以上の項目を発表に含め、情報プロダクトを発表しました。

[具体的なアドバイス]
・形よりどういう風に表示されるかが重要。
・システムや仕組みはどうなっているか?(どうやって発光?どうやって取り込む?)
・操作方法は難しくないか?シンプルに
・普段の使い方。持ち歩くものなら、持ち歩くのに適した形か?
・自分のオリジナリティの部分をつめて完成度の高い作品にしてください。
・具体的な操作やシーンが入ってない発表が多い。
・自分でやってみて→必要かわかる。
・アイディアを実現する仕組みを考える。
・期間限定系な提案は使用期間が終わったらどうするの?
・こういう使い方だからこの形。
・使用時と使用してないない時の差は?(持ち運びなど)
・マルチより特化してしまった方がいい場合もある。

次回
[持ってくるもの]
・モックアップ(今回、忘れた人も持って来た人も)
・画面のスケッチ(手書きで可)

前半:インターフェースの検討
後半:スナミさん(千葉工業大学のOB)に来ていただいて発砲材によるモックの作り方を教わる。