Purpose
- ページの目的 -
ALCHEMY White Boxにて様々な情報を開示していても、デザイナーを目指す方にとっては「研修はどんな感じなのだ ろう…」「先輩はどのようにしてデザイナーデビューしたのだろう…」など、気になる事はまだまだ多いかと思います。 本ページでは、デザイナーを目指している方が気になるであろう情報をできるだけ開示し、少しでも不安をなくすことを 目的としています。
Curriculum
- カリキュラム -
実際にALCHEMYのデザイナー研修生が行なっているカリキュラムの一部とレビューの様子を公開します。
- デザイン座学(目標:3days)
- 基本操作(目標:4days)
- バナー課題(目標:1weeks)
- HTML / CSS課題(目標:2weeks)
- LP課題(目標:1weeks)
- UI課題(目標:3weeks)
- その他:デザインタスク / 個人課題(目標:4weeks)
- UX/UIデザイナーを目指したEさんの場合
- UI課題や個人課題を元に得意分野を活かし、上流工程(要件定義、情報設計)まで行うことができる
- 市場分析や競合調査などを行いサービス理解を深めた状態で設計することができる
- Atomic Design を理解し、コンポーネント設計ができる
- 見せたい情報に対して的確なUIを提案できる
- プロトタイピングツールをマスターして、デザインのみならず会議や提案用の資料作成もできる
- サービス向上のためのコミュニケーションができる
- デザイン思考を用いて作業することができる
- Webデザイナーを目指したKさんの場合
- デザインするにあたって必要な情報を調査・ヒアリングできる
- あしらいや素材を自分で作成し制作物に落とし込める
- デザインの意図を汲み取り、レビュワーとして活躍できる
- ペルソナを理解したデザインができる
- 適切なフォント、あしらい、カラー、レイアウトができる
- デザイン4原則を活用し、情報を整えたデザインができる
- レギュレーションに準じた制作物がデザインできる
- デザイン思考を用いて作業することができる
使うツール
用途:課題の制作
用途:教材・課題の確認
用途:課題提出・レビュー依頼
用途:オンライン上でのコミュニケーション
fre:sta
ALCHEMYでは未経験者からデザイナーになるためのWebデザインスクールを運営しています。
Recommendation
- おすすめの本 -
現場に出ているデザイナーと研修生が読んできたオススメの学習書籍を紹介します。
研修生
良かった点・参考になった点
- 1つのオーダーに対して4つの違うデザインを載せている本なので、デザインの引き出しが増える
- デザインの言語化もしっかりされているので参考になる
良かった点・参考になった点
- 勉強し始めの方に特におすすめ
- 情報を伝えるデザインとして「やってはいけない」ことを学べる
- ダメな例、良い例がセットで載っているので改善策を学べる
- 「なんかダサい」をなぜダサいのか分かるように言語化してくれているので学びになる
良かった点・参考になった点
- バナー作成における、情報整理の大切さや注意すべき点、デザインの工夫やテクニックがすべてまとまっている
- バナーのお題が掲載されているので、実際に手を動かした自己学習に役立つ
- 修正前と修正後を比較しながら説明しているので、良し悪しを学べる
- 実例が多いため、レイアウトや配色などの引き出しが増える
出向しているメンバー
良かった点・参考になった点
- 実際にコンバージョン改善させた制作事例が47個あるためグロースハックの参考になる
- Google Analyticsの使い方や分析の仕方なども載っているので、実際の現場で重宝する
良かった点・参考になった点
- デザインガイドラインだったり、運用ルールを作っていくとなった時に役立つ
- 命名規則だったり、パーツなどをどういうパターンで定義していくべきかなども記載されているので、UIデザイン案件で役立つ
良かった点・参考になった点
- デザインの初稿からFIXするまでの過程が記載されている
- デザインの注意点や新しいを着眼点を得られるので、駆け出しデザイナーのみならずレビュワーにもおすすめ
Skill
- スキル感 -
デザイナーデビューを果たした人が、研修期間中に課題を経てどのように成長したか Before / After 形式で一部紹介します。
Case1「ブログ誘導バナー」
Before
After
Review
“デザイン初心者が知るべきこと”ブログ誘導バナーを提出します!
■ターゲット設定 ・デザイナーになりたての20代男女
・デザイナーを目指すために、勉強を本気で始めようとしている人 ・デザインに興味があり、学び始めた人
■カラー選定の意図
・ フォントや図形は白と黒でシンプルに。デザインブログのバナーということでシンプル系やポップ系よりはモード系が馴染むと思い、この色に選定にしました。
■フォント選定の意図
・ タイトルは明朝体、リストにはゴシック体を使用して明確に差を出しました。タイトルの一部を縦書きにして自然と目を引くように。
・レイアウト、全体の意図 中央には反復を用いてブログ掲載内容を箇条書きで設置。テキスト中心のバナー希望だったので、できるだけイラスト等は入れず文字だけで全体の骨組みを作りデザインしています。背景画像は暗い中に少し色が入っているものにして白い文字が際立つようにしました。
レビューします!
■良き点 ・配色ルールについてはとってもいいと思います!品良くグラデーションも効いていて背景としてはいいものなんじゃないかな?と! ・フォントの選定に関して、コンテンツごとに "明朝、ゴシック" と変える事で、意図的に差別化を図っている点もやり方として◎
■修正点 ・タイポグラフィ「デザイン初心者 / が知るべきこと」の「/」の箇所で切られてしまっていますが、接続詞を「〜初心者」につけてあげたほうが、文章として成り立ちます!また次のテキストに誘導しやすい物になりますので、調整してみてください。
・あしらい 反復の箇所はユーザーが 興味を持った後に見たいと思う内容(このバナーにおけるメインコンテンツ)です。箇条書きにすることでリズムをつけていることは伝わりますが、ただテキストを置いただけ感出てしまってますので非常にもったいない!もう少し工夫をしてみてはいかがでしょうか?
・余白「デザイン初心者 / が知るべきこと」の周りの余白が少し狭いです!テキスト周りにあと少しゆとりを持たせることで、パッと見た際、情報の入りにスムーズさを持たせることができると思います。
・余談 ルビはトリでタイポグラフィを考えてみるのもいいかも。ターゲット(デザイナーを目指している年齢層)を想定した時にルビの必要性があるのか。
■修正後
「“デザイン初心者が知るべきこと”ブログ誘導バナー」修正版です!全体的にレイアウト・背景ガラッと雰囲気を変えてみました。
■変更点 ・ターゲット層を20代に設定しているので、改めて配色含め、デザインを見つめ直した。
・当初、反復パターンを縦のみでしか考えていませんでしたが、レイアウトを変更しました。
・優先順位を整理し、プロが教えるを小さめにしました。下に吹き出しをつけ、左上の足りない感じをなくした。
・遠目から見ても綺麗に見えるよう、確認しながら配置しました。
・全体のルビを取った。
・ボタンをやめ、帯にした。
・“デザイン素材サイト”の“デザイン”の部分をとって情報をすっきりとしてわかりやすくした。
Case2「ゴルフ専門店バナー」
Before
After
Review
ゴルフ専門店バナー レビューお願いします!
■ペルソナ設定 ・47歳男性 経営者 ・ややワイルドでダンディーな雰囲気 ・10年前に離婚して今は一人暮らし ・趣味はバイクとグルメ ・ハマるとのめり込むタイプ ・良いものを長く使い、物持ちがいい(革など味出てくるもの好き) ・休日はゴルフかツーリング ・海外旅行も好きだが、コロナで行けなくなってしまったので友人に誘われゴルフを始めた ・初心者向けのパターを使っているが、もっと合うものがあるのではないかと思っている
・サマーキャンペーンだけだと写真を見て初めてゴルフに関係するものだとわかるため、キャンペーンと共に視界に入るように、『ゴルフ専門店』を加えた。
・経済的に余裕があり、値段よりも良いものを購入したいという思考が強いため、販売ページへ誘導するきっかけとしては、お得感よりクオリティの高さを印象付けられるように、下部の文言を加えた。
・セールの詳しい情報(日程)は、セールに興味を持って初めて必要とされる内容なのと、今回のペルソナでは、あまり特典は響かない内容なので、小さく配置した。
■良き点 ・高級感と夏らしさのあるカラー選定が良き良き ・ペルソナ設定も細かくできてますね! ・背景のぼかし、いい。
■修正点 ・優先順位 → サマーキャンペーンが一番上位になってますね! ・ボタン → 中央に配置してあげてください! ・タイポグラフィ → 情報の強弱が弱いです。優先順位を洗い出して、どのように見せれば優先順位通りになるか考えてみましょう!
■修正後
ゴルフ専門店バナー 修正版です! 良き点をあげていただいたところがもったいなかったのですが、修正点に注意して大幅に変更しました。新たに修正点出てきたらすみません。
■変更点 前回は『夏らしさ』に重きを置いたカラー選定だったが、目的はゴルフ用品を買ってもらうことなので、ゴルフ用品のバナーだと瞬時に伝わりやすいように緑を選んだ。緑 → 夏の深緑、ゴルフ場の芝生目立たせたいフォントは、爽やかさをプラスするために白を選んだ。
Interview
- インタビュー -
ALCHEMYのデザイナーメンバーを紹介します。
Member 1
- ニックネーム:りさ
- ポジション:デザイナー
- 出向先業務
- UIデザイン(システム系、ECサイト)
- Webデザイン(コーポレートサイト )
- コーディング
- 社内業務
- 教育関連
- 入社前
- 入社後
出向しながら社内業務にも携われることが嬉しい反面、忙しい中タスクをこなせるか不安でした。
優しい先輩方がサポートしてくださり上手く両立できています。スケジュール管理を徹底しています。
自己学習としてバナーやLPの作成、HTML/CSSを学んでいました。
- JavaScript
- UI/UX
- マーケティング
Member 2
- ニックネーム:ベティ
- ポジション:デザイナー
- 制作会社への出向業務
- LPデザイン
- UIデザイン
- デザイナーチームのマネージャー業務
- 新規事業
SESに対するイメージは入社前と特に変わっていません。
私は幅広い業界のデザインを手がけていきたいと考えていたのですが、SESという環境は様々な案件を経験できるため、私がやりたいことと一致しているなと感じました。
たくさんの案件で学んで行きたいです。
とにかくPhotoshopが使えないとダメだと思い、バナーを作成したり、良いと思ったデザインのトレースをしていました。
- JavaScript
- マネジメント
- ディレクション
- UI/UX
Member 3
- ニックネーム:たかざわちゃん
- ポジション:UIデザイナー
私は大きく分けて出向業務と社内業務の2つを行っております。
詳細については下記になります。
- 出向業務
- 案件企画
- デザイン
- 分析
- レビュー
- 社内業務
- 社内教育
- 新規事業
出向先で初めて任された仕事が、病院に貼るポスターのデザインでした。
しかし印刷物の経験はあまりなかったので、恐る恐る「印刷物は経験少ないんですけど入稿する際のルールとかありますか?」と聞いたら優しく入稿ルールをインプットしてくれたので、経験が少ない分野に関する質問をしても特に問題ないんだなと安心しました。
出来上がった時は「うお〜私が作ったやつが世の中に出た!!」とテンション上がったのを覚えています。
要は派遣でしょってイメージがありました。 出向している人同士は、名前も顔も知らないと思っていましたが、実はそんなこと全然なくちゃんとメンバー同士が仲良くしていて驚きました。
あと、出向先の方々も私に対して社員と同じように接してくれたので、ドラマとかで見かける派遣や業務委託の働きにくそうな感じは一切なかったです!
SHElikesに入会して勉強していました。
あとはレビューをもらえる企画に参加して、制作物のレビューをもらっていました。
今はモーショングラフィック・動画制作技術・Google Analytics分析からの仮説立てを学んでます。
End Credit
- 製作者 -
Producer
Kohei Ichiba
Taito Morikawa
Designer
Asuka Kurigami
Mina Sonobe
Mao Tanaka
Seina Sato
Ryusei Tashiro
Cooperation
Yuto Shimada