制作実績

初めての挑戦

全ページのコンセプト設計から手がけるWebサイトデザインは今回が初めてで、しかもページ数が多く、ドキドキの連続でした。
さらにイラスト制作、After Effectsを使ったアニメーション図の制作など、初めてのことが重なり苦戦も多くありました。
それでも一つひとつに向き合うなかで、デザイナーとして大きく成長できた制作だと感じています。

デザインコンセプト

「ここなら自分も子どもも大丈夫そう」
不安を抱えた保護者さんが、自然と深呼吸できるサイト。これを軸にデザインを進めました。
主なターゲットは20代後半〜40代の保護者さんです。
初めてサイトを訪れた方が、「どんな人が、どんな雰囲気で子どもと関わっているのか」「自分の子どももここで過ごせそうか」を具体的にイメージできることを重視しています。職員の顔や姿、お子さまがレッスンを受けている様子が伝わる写真を多く使い、「誰がやっているのか・どんな空気感の場所なのか」が視覚的に伝わる構成にしました。
配色は、法人のイメージカラー（#09A7B4）およびロゴに使用されている黄色系をベースに、明るく温かみのあるトーンで全体を統一しました。
不安な状態でサイトを訪れることも想定し、情報を詰め込みすぎず、感情に寄り添う構成を意識しています。各要素の間隔を広めにとり、落ち着いて読み進められるゆったりとした印象に。
一方で堅くなりすぎないよう、写真を丸く切り抜いたり、鳥のイラストを配置したりと、やさしさの中にさりげない遊び心も加えました。
「よくいただく相談」のセクションは、保護者さんが順番にクライアント様のところへ相談しに来るようなチャット形式を採用。
少しでも不安を払拭できるよう、身近に感じていただける表現を選びました。
最終的には、安心感を持って読み進めていただき、見学予約・お問い合わせへ自然につながる構成を目指しています。

膨大な情報をわかりやすく届ける

情報量がとても多いサイトだったため、いかに整理してわかりやすく伝えるかを徹底的に検討しました。
クライアント様の大切な想いがこもった文章を、ただ流し込むだけではもったいない。重要な内容はボールドや色づけ、フォントサイズの調整で視覚的なメリハリをつけ、読み手の負担を減らす工夫を重ねました。

クライアント様の想いを「言葉」から掘り下げる

「やさしい」「温かい」「安心できる・ほっとできる」「地味じゃなくてポップすぎない」
こうしたふわっとした言葉の本質をかみ砕き、クライアント様の意図や想いを探ることの大切さを学びました。
たとえば「お悩み」一つとっても、どんな悩みか、どんな気持ちか、どう感じてほしいのかで表現は大きく変わります。
深刻なお悩みであればチクチクした図形やぐるぐるした表現に。前向きな悩みであれば、丸や三角のシンプルな図形やもくもくと柔らかい図形にすることで、マイナスではなく前を向く印象に変わります。
言葉一つを深く掘り下げることで、初めてデザインとして表現できるのだと実感しました。

写真の補正

撮影時間・場所・撮影者がバラバラな写真を、同じトーンに揃える作業は想像以上に大変でした。
一枚ずつ見比べ、全体に並べて違和感がないかを確認し、なかには10回以上補正した写真もあるほど細かく調整しました。
デザインレビューでは「全体的に暗く、青みがかったトーンが冷たい印象を与えている」とご指摘いただき驚きました。
露出を上げ、ホワイトバランスを暖色寄りに調整するだけで、サイト全体の印象が一気に変わり、写真の力をあらためて実感しました。

手描きの温度感を大切に

イラストは趣味で描く程度で、お仕事として描くのは初めてだったため苦戦しました。
タブレットで下絵を描き、Illustratorで清書し、線やバランスを整えていく。そんな工程を重ねながら、セッション中の様子をゆるっとかわいらしい雰囲気に仕上げました。
サイト上を自由に飛び回る鳥は、ロゴにも描かれているキョクアジサシ。世界最長距離を飛ぶ渡り鳥で、「出会う人たちが、それぞれの人生を目標に向かって飛び続けてほしい」という想いが込められているとお聞きし、サイト上にもその想いを引き継ぎました。

コンセプト図とアニメーション

クライアント様の想いを表現する、もっとも重要なコンセプト図。
この体験や関係性が、家族やクライアント様からはじまり、やがて他の家族、所属の園、家族以外の人、そして学校という環境へと広がっていく。未来の学校・将来の社会生活へとベクトルが伸びていく。適切な理解と工夫に基づく穏やかな関係と環境づくりで、子どもがその子らしく過ごしていくこと。
わくわくの輪が広がっていく様子。これらをどう一枚に落とし込むか、何度も検討を重ねました。
After Effectsでアニメーションをつけ、関係性の広がりに合わせて人のイラストがにょきにょきと登場したり、「ワクワク」の文字がポンポンとリズムよく現れたり。
見ていてワクワクできるよう、遊び心も加えています。

デザインレビューで気づいたこと

「もう少し垢抜けて、おしゃれに」したい、でも何が足りないのか、長く悩んでいました。
デザインレビューで「情緒的なおしゃれさが不足している」と教えていただき、写真に光のエフェクトを加えたり、ベタ塗り背景に微細なグラデーションや質感を足したり。それだけでデザインに温度が生まれ、垢抜けた印象になりました。
ついつい正解を求めてしまっていた私に、「デザインの微細な調整が生む『心地よさ』こそが、今回のサイトの本質的な価値です」という言葉が深く響きました。
微細な調整を繰り返すことが、クライアント様らしさを表現する第一歩だと、いま実感しています。

チームへの感謝

ページ数が多いうえに全ページ違うレイアウトを組んでしまったので、実装は大変だったかと思います。素早く丁寧にコーディングいただいたコーダー様、ありがとうございました。
アニメーションも案出しの段階から簡易実装でご提案いただけて、イメージがとてもしやすかったです。
コーディングしにくい箇所をご相談いただけたおかげで、デザイン調整もスムーズに進められました。

ディレクター様には週一回のミーティングを設けていただき、進捗報告や悩んでいる箇所の相談ができ、安心して取り組むことができました。
各スタッフ様への内容提供をアンケートフォームで集約するなど、忙しいクライアント様の手間を最小限にしながら必要な情報を期日までにいただく工夫は、私にとっても大きな学びでした。

思いやりを持った実装

今回の制作は私にとって、襷ウェブの卒業制作となります。
そのため、制作に入る前からなにかテーマを決めて取り組みたいと思っていました。
自分が決めたテーマは「思いやり」です
ユーザーが見ていて違和感を感じる部分はないかな？メンテナンスや追加作業のときに、短時間で、そして迷わずに作業できる方法は？
そういった視点を大切にして取り組みました。　

こだわりポイント

上記にあげたとおり、「思いやり」を意識したポイントでいうと、youtubeの再生時の音量についてです。
こちらはデフォルトをOFFに設定しました。ユーザーには親御さんも多いため、お子様が寝ている間などに閲覧することもあると思います。
そのなかで、いきなり大きい音が鳴るのは避けた方がいいと思ったからです。
情報量が多く頭をフル回転で実装したのは「代表の紹介」ページです。あともう少し、あともう少し、と言いながら
なかなか終わらなくてすこし落ち込みました笑

今回の制作を通して

私は今までに実装をしたことがない方法や、つまづいた部分はNotionで記録をとっています。
今回は20以上の項目がありました。
それだけ濃く、充実した内容のサイトに携われたことの達成感はすごく大きく、山家さんが過去最高傑作とおっしゃって下さったことも嬉しかったです。
ここが難しい・・という相談に自分では想像もしなかった方法で対処法を作ってくださったデザイナーさん、
いつも明るく、クライアント様に寄り添って対応してくださったアシスタントディレクターさんにもとても感謝しています！
ありがとうございました

担当案件と役割

今回担当したのは、発達支援事業のホームページリニューアル案件です。私はアシスタントディレクターとして、ワイヤーフレームの作成と進行管理の補助を担当しました。これまでデザイン視点で制作に関わることが多かった中で、今回はより広い視野で情報設計やチーム全体の動きを捉える立場を経験できました。クライアントの想いや利用者の気持ちを汲み取りながら、サイト全体の方向性を形にしていく過程に携わる中で、ディレクションの責任とやりがいを強く実感した案件でした。

課題として向き合ったこと

特に大変だったのは、既存のホームページに掲載されている情報量が多く、まず事業理解を自分の中でしっかり腹に落とすまでに時間がかかったことです。発達支援という領域は、サービス内容を正しく理解することはもちろん、利用を検討される保護者の方の不安や悩みにも想像力を持って向き合う必要があると感じました。そのため、言葉選びや情報の見せ方、構成の順番ひとつを決めるにも、「安心してもらえるか」という視点で何度も考える必要があり、難しさと責任の大きさを感じました。

取り組みを通して得た学び

既存サイトを腹落ちするまで丁寧に読み込んだからこそ、残すべき情報、削ってよい情報、さらに補足した方が伝わりやすい情報が見えるようになったことは大きな学びでした。また、頻繁にやり取りができないクライアントであっても、対話の中で出てくるキーワードや表現から、何を大切にされているのかを汲み取れることにも気づきました。加えて、ディレクター・デザイナー・コーダーがそれぞれを尊重しながらも、必要な意見はきちんと伝え合える雰囲気があったことで、より良いものづくりにつながったのだと感じています。

今後に活かしたい視点

今回の経験を通して、良いものづくりのためには、進行を管理するだけでなく、チームの中に安心して意見を出し合える空気をつくることもディレクターの大切な役割だと感じました。ディレクター・デザイナー・コーダーが互いを尊重しながらも、必要なことをきちんと伝え合える環境があったからこそ、より良い制作につながったのだと思います。今後自分がディレクションを担う際には、そうした関係性づくりも意識しながら動いていきたいです。また、年齢や立場の異なるクライアントとのやり取りでは、同じ言葉でも受け取り方が異なることを前提に、受け取るときは広い視野で、伝えるときはより丁寧な配慮を心がけていきたいです。

これからに向けて

今回の案件を通して、私はディレクションの面白さと難しさ、そのどちらにも強く惹かれました。情報を整理し、相手の想いを汲み取り、チームで意見を交わしながらひとつの形にしていく過程には、デザインとはまた違った大きなやりがいがあると感じています。まだ学ぶべきことは多いですが、その分もっと成長したい、もっと良いディレクションができるようになりたいという気持ちが一層強くなりました。今回得た経験を次につなげながら、これからも積極的に挑戦を重ねていきたいです。