見出し画像

ドリーム・アーツ25周年記念サイトのデザインについて

あけましておめでとうございます。ドリーム・アーツのデザイナーです⛩️
ドリーム・アーツは今年で25周年を迎えます!
そこで今回は去年Twitterでも紹介した「 25周年記念サイト 」と、QRコード付きのクリスマスカードのデザインについてを今回制作業務に携わったデザイナーのYさんにお話を伺いました✨

0 のコピー

🎅 インパクト重視! クリスマスカードのデザイン

0 のコピー 2

ー QRコードを全面に押し出すというアイディアはどうやって生まれたのですか?

Yさん:色々出した案の中に「カードのQRコードからサイトへ飛ぶと、社員からの感謝のメッセージが載っている」というものがあり、そこから今回の形になりました。
あとはとにかくインパクトを重要視していたので、QRコードを読み込んでもらうためにも一般的なポストカードよりもサイズの大きい紙を使用し、全面に押し出すデザインにしています!

ー QRコードはサイトで生成してIllustratorで編集したのですか?

Yさん:そうそう。ちょっと潰れたような四角の形はサイトからだけど、真ん中の文字部分とかの調整やキャラクターの配置などは、社長からの意見も参考にしつつIllustratorで編集してます。
あと裏面の切手部分のQRコードに使われているPOPYはモバイルアプリを使って、POPYのデザインに詳しい社員と相談しながら、輪郭の丸さなど何度も調整しつつ指で書いたんです。

0 のコピー 3

ー 社長や他社員の熱も込められているんですね!

Yさん:プロセスの中で他の人のアイディアや意見を参考にする事が多かったので、他の人の頭の中にあるものや想いを実際に見えるデザインとして落としこんだのも力を入れたことの一つです。

🎉 25年の歴史が分かる記念サイトデザイン

0 のコピー 6

ー サイトでの一押しや工夫した部分について教えてください。

Yさん:ススマートフォンからQRコードを読み取ることを想定し、モバイルファーストでデザインを考えていったのが工夫した部分ですかね。なので、PCで見ると右側にモバイルの画面が帯状になって現れるところも面白いポイントだと思います!あとは社長からのリクエストもあってスクロールするとついてくるPOPYなどを左下に入れたり、アニメーションを入れたりなど見る人に楽しんでもらえるようにしています。

0 のコピー 5

Yさん:またレイアウトでも楽しさや特別感を出す工夫しており、敢えてバラつきを出すことでファッション雑誌のような賑やかさと、リズム感がある画面を目指しましたただ色々試した結果、テキストだけは読みやすい方が良かったのでグリッドを使って、揃える部分は揃えるように調整を入れてます。

0 のコピー 4

ー 他に制作の中で苦労した点などありますか?

Yさん:一番はトライアンドエラーを繰り返す中で、どんどん制作スケジュールが短くなっていったところかもしれません…。
そういうこともあり、今回は特殊ですが、画像と文字は全てまとめてSVG書き出しをして、そのまま画面に貼り付けることでコーディングに時間をあまりかけないようにしています。
そのため文字の大きさなど修正したい!となったときには、画像を全て変更して差し替えなければならないのが大変でした…。
ただサイトを訪れた人からのメッセージを読むと、伝えたかった感謝がしっかり届いているということが分かって、苦労したけど良かったと感じています!

ー お話しありがとうございました。是非実際のサイトをご覧ください!

QRコードはBtoCのクロスメディアプロモーションだけでなく、このようなBtoB企業のブランディングの一環としても使うことができるんですね。
本年もドリーム・アーツをよろしくお願いします!