Figmaを用いたチームでのデザイン批評
こんにちは、マスダです。
最近はデザイナーよりもフロントエンジニアのお仕事が多くて、私の肩書きってなんだっけ…?と思っています(笑)
ともあれ、所属はデザイン部なのでチームのmtgではグラフィックデザインやUIデザイン、動画作成などメンバーのデザイン仕事の話を聞いてデザインに触れています。
これがなかったら、肩書きはもうエンジニアを名乗って…肩書きなんかに縛られているのがよくないですね。肩書き関係なくなんでもやります!と言っていた方が自分の好きなように仕事ができるものです。
さて、話を戻しまして、
私の勤めるゴーリストのデザイン部では、私のように大学時代は樹木の研究をしていたというデザイン初心者から、グラフィックデザインをやっていましたという海外出身メンバーまで、スキルにはとても幅があります。
そこで、デザインのスキルアップをみんなでしよう!という志のもと週に1時間、デザトレ!(デザイントレーニングの略)を行っています。
ペルソナやカスタマージャーニーマップを作ってみたり、他社のLPや名刺、アイキャッチなどを批評してみたり、ときにはもくもく会を開催したり。
いろんなことを題材に、チームで知識の共有やスキルアップをしています。
今回はそんな中でも、グラフィックチーム主導で行っているデザイン批評の様子をお届けしたいと思います。
ちなみにデザイン部メンバーのnoteはこちらです。興味があればぜひ!
Figmaでデザイン批評
使っているツールはFigmaです。もうFigma最高ですよね。
UI作成にはもちろん、私はビジュアル的なメモや思考を整理する時にもFigmaを使ったりしています。
今回は複数人でのリモート作業ということで、メンバーが使い慣れていて、リアルタイムに同時編集ができるFigmaを利用しました。
準備するもの
デザイン批評を行うのに必要なものは題材と付箋です。
付箋は3種類あり、色ごとに下記のようにわけて使用しています。
青:良いと思ったポイント
黄:判断に迷うけど悪いと思うポイント
赤:悪いと思ったポイント
デザイン批評の行い方
1、題材について、使用箇所やターゲットなどについてみんなで確認する(5分)
2、各自気になったポイントに付箋を書いて貼っていく(10分)
3、付箋をある程度カテゴリーに分けて整理する(5分)
4、1枚ずつ読み上げて内容を確認する、(10分)
5、批評対象のデザインに対して、意見をまとめる
実際に批評してみた
ゴーリストが運営するメディアHRogのアイキャッチを批評してみました。
1、題材について、使用箇所やターゲットなどについてみんなで確認する(5分)
題材を用意する人が、その題材の使用箇所や誰に向けて製作されたものなのかをまとめたものをあらかじめ用意しておくといいでしょう。
2、各自気になったポイントに付箋を書いて貼っていく(10分)
この作業は各自もくもくで喋らずにひたすら付箋に気づいたことを書いていきます。Badポイントだけでなく、Goodポイントも書くことで、なんとなくいいな〜からどうしていいのかがきちんと言語化できるようになります。
3、付箋をある程度カテゴリーに分けて整理する(5分)
このアイキャッチを制作した人も批評メンバーにいましたが、みんな容赦無く赤や黄色の付箋を貼っていますね(笑)
4、1枚ずつ読み上げて内容を確認する、(10分)
このアイキャッチでは、グラフィックの細かい指摘(余白や色など)やキャラクターの使い方についての指摘が多かったです。
こうした批評の数々に、製作した本人は「そうですよね〜今見てみると自分甘いなと思いますっ…」と言っていました(笑)
作っている時にはなかなか気づかないポイントもありますよね。
5、批評対象のデザインに対して、意見をまとめる
今回は細かい指摘はあったものの、ターゲットの好みに合わせたデザインになっていること、そのため目に止めて読んでもらえそうなところは高評価でした。
一方で右下のカエルのキャラクター(名前:ふろぐん)については、どこまで表情を変えていいかなどきちんと決まっていないので、そこは今後決めていかなくちゃねという話になりました。
以上、Figmaを使ったデザイン批評でした。
Figmaだとリモートで離れている場合でも、同時に編集できるしカーソルでどこを見ているのかわかるので、スムーズにコミュニケーションが取れるなと思います。
Figma最高ですね!!
最後に宣伝させてください!
ゴーリストではUI/UXデザイナーを募集しています。
どうして募集するのかや、仕事内容、募集要項などの詳しい情報は下記のnoteで書いています。興味のある方はぜひエントリーしてみてください〜!