MHCID, Design & Prototype

 2019年が終わるまでにFall Quarter中に受けたもうひとつの授業「Design & Prototype」についてまとめようと気合いが入っていたのですが気づいたら大晦日でした〜。User Needs Analysisの授業についてはこちらにまとめています。

◇◇◇

 今回の記事では、Design & Prototypeの授業についてまとめたいと思います。名前の通りで、デザインを学び、プロトタイプを作成しました。デザインエクササイズとプロジェクトの2つで授業は構成されていました。User Needs Analysisと違ってこちらの授業は先生の講義はあまりなく、テキストと有料動画から学びました。課題の評価はクラスメイトと先生から毎週厳しくチェック(フィードバック)されました。

Design Exercises


 デザインエクササイズの課題では、紙にスケッチしたりSketchとinVisionというソフトウェアを使ってUIを作成したりしました。提出した課題を少し紹介したいと思います。私はとてもとても絵が下手なので全然笑っていただいてOKです!

Sketches

 たくさんスケッチをしたのですが、そのなかでも最初の方に描いた課題を紹介します。

sketching.JPG

 既存のわんちゃんと既存のオオカミをスケッチし、各動物の特徴とアフォーダンスを書き出しました。(別で文章にして提出しています)絵は紹介しませんが、3つ目のスケッチには既存の動物たちの特徴とアフォーダンスをピックアップし、新しいタイプのわんちゃんをスケッチしました。自分の目で見た特徴を紙に絵として描くというのは難しいし、そもそも絵のセンスがないので自分で笑いながら描いてました。クラスメイトの課題もすべて公開されているのですが、やっぱり美術部卒業の子たちの絵がとても上手でした。(私も小学生のときは何年かアートのクラス通っていたのにな...)

 その他スケッチの課題はアイデアをスケッチにしてみたりWireframeを描いてみたりしました。アイデアをスケッチにするのは得意で、アイデア系の課題の評価はいいほうでした。

Wireframes & Prototype

 この課題ではデザイン的によくないウェブサイトをピックアップし、よくないポイントをまとめて自分なりのリデザインをSketchで行いました。今回のウェブサイトは私が通っていた高校のホームページをピックアップしました。リンクがびっくりするぐらい多く、情報がカラム式になっているのでとにかくシンプルにしたい!という気持ちを込めたリデザインが右の画像で紹介しています。初めて一からSketchを使ってUIを作成したので、自分の不慣れさにイライラしました。このあともSketchに慣れることはなくイライラしながらデザインを作成していました。
 その他デザインの課題は既存アプリのUI改善を行ったりAccessibility目線のUI改善を行ったりしました。紙のスケッチとSketchでLow-fidelity/High-fidelity wireframeからinVisionで動くPrototypeを作成しました。

wireframe.JPG

Project Deliverables 

Double Diamond Method

 プロジェクトのほうではBritish Design Councilが紹介したDouble Diamond methodを使用して課題が進んでいきました。英語の記事になってしまいますが、下記の画像にDouble Diamond methodについて説明しているMediumの記事をリンクしました。私が最初に書いた記事にてざっくり説明しているので、そちらも合わせて読んでいただけますと幸いです。

Explained by Dan Nessler

Explained by Dan Nessler

Project Theme

 ひとつのドキュメンタリーをベースにプロジェクトを作成していきました。ドキュメンタリーのテーマはGentrification(下層住宅地の高級化)で、ドキュメンタリーから感じたものをプロジェクトのテーマとしました。私はGentrificationに影響されている人の気持ちに注目しました。もともとその地域に住んでいる人たちはその地域の歴史や文化を失いたくない・忘れたくないという気持ちが強いです。また、新しく引っ越してきた人たちはその地域のことを知らない・地域のこと知りたいしお友達を作りたいという気持ちがあると思います。こういった気持ちを感じている人たちにはコミュニティー向け掲示板アプリがいいのかと考えました。なので、コミュニティー向け掲示板アプリの作成に頑張りました!inVisionで動くPrototypeを作成し、ここまでやってきたことをすべてまとめ発表するのが最終課題でした。

dp-1.jpg
dp-2.jpg
こちらのプロトタイプのinVisionのリンクを画像につけました

こちらのプロトタイプのinVisionのリンクを画像につけました

 クラスメイトみんな同じドキュメンタリーで同じDouble Diamond methodを使用してプロジェクトを進めたのにも関わらず、様々なテーマがピックアップされていてみんな違うプロダクトを作成していたのを見るのがとてもおもしろかったです。

◇◇◇

 美術的センスがない私にとってとても苦しんだ授業でしたが、デザインの基礎を学ぶことができて本当によかったです。先生とデザイナーしているクラスメイトの鋭いフィードバックが心に突き刺さりましたが、LayoutやGridが大切なことを感じました。また、提出物がクラスメイト内に公開されているためデザイナーしているクラスメイトの提出物をじっくりと見てそこからもたくさん学びました。冬学期(次)もデザインの授業があることを知って気持ちはとても沈んでいますが冬休み中に読みものと動画を見て先に学んで頑張りたいと思っています。

追記

 ドキュメンタリーの名前は「Priced Out: Tales of Gentrification」です。監督は「Cornelius Swart」で彼と直接インタビューしてお話を聞きました。

Previous
Previous

MHCID, User Experience

Next
Next

MHCID, User Needs Analysis