ほぼ全ての工程をStudioで完結。グラフィック出身のデザイナーが提案するシームレスな制作プロセス

Studioが実施した「Studio Experts」加盟事業者へのアンケート調査では、加盟事業者の36%がサイト制作の初期フェーズからStudioを活用していることがわかりました。

なかでも「STUDIO DESIGN AWARD 2022」でSHIFTBRAIN賞（協賛企業賞）を受賞したメアリーアンドディーンの影山さんは「Webサイト制作の全工程をStudioで完結できる」と話します。

グラフィックデザインを中心にキャリアを積み、その後Webデザイン業界へ本格進出。現在はStudioを活用して効率的なワークフローを確立する影山さんに、Studioを活用したWeb制作プロセスを伺いました。

デザインのクオリティをおとすことなく、デザイナーひとりでサイト制作を行えるツール

──これまでのキャリアについてお聞かせください。

影山：約10年間、デザイン事務所や地方の広告代理店に所属してグラフィックデザインやアートディレクションの経験を積んだのち、30歳で独立しました。その後10年以上にわたる活動の中で、Webサイト制作も手がけるように。最近ではWebデザインの仕事が多くなっています。

──Studioを活用し始めたきっかけは何でしたか？

影山：使い始めたのは2021年頃、Studioが「STUDIO2.0」を標榜しCMSの機能が追加されるなど、大きなアップデートが話題になったタイミングです。Studioを活用する前はコーディングを外部パートナーに依頼していたのですが、Studioでデザインから実装までを一人で完結できれば、予算面でお引き受けが難しかったご依頼にも対応できるのでは、と考え使い始めました。

──使い始めたときの印象はいかがでしたか？

影山：使い始めた当初から、Studioは使いやすく、その後もいろいろなアップデートによって実現できるデザインの幅もどんどん広がっていて満足しています。また特に個人や中小企業のお客様にとって、制作費や納期、更新性の観点でStudioを導入することは大きなメリットだと感じましたね。

デザインのクオリティを保ちながら、デザイナーひとりでサイトの公開までを完結できることは非常に魅力的で、今でもその利便性の高さから使い続けています。

ほぼ全ての工程をStudioで完結。ワイヤーフレーム・デザイン・実装を同時並行で進めている感覚

▲影山さんが制作を担当した「江本洋海さんの不動産購入・売却サービスサイト」

──現在、Web制作に使用しているツールを教えてください。

影山：今はワイヤーフレームの作成からデザイン、実装まで、ほぼ全ての工程をStudioで完結しています。素材作成に関しては、必要に応じてPhotoshopやIllustratorを使用していますが、それ以外はStudioだけです。

──StudioオンリーでWebデザインを完結させている理由は何ですか？

影山：デザインの段階からライブプレビューによってブラウザの横幅に応じた見え方を確認できるので、レスポンシブを意識した制作がしやすいことが理由のひとつです。

他のソフトでデザインを行ったとしても、Studioでの実装の段階でより良くなるようにデザインを再度検討したり変更したりすると思うので、「デザイン」と「実装」という工程で区切らずにStudioで完結するほうが効果的だと感じています。

Studioで一からデザインをするのは最初はやりづらいと感じるかもしれませんが、慣れてくるとスムーズに進めることができます。お客様にとってもデザインと実装の確認を別々に行う必要がないこともメリットのひとつです。

クライアントとのやりとりもStudioで。シームレスな制作フローで作業効率アップ

──どんな案件でStudioを活用するのがおすすめですか？

影山：クオリティを保ちながら制作費や納期を圧縮できますし、運用にかかるコストは基本的にStudioの月額費用のみですので、特に中小企業や個人で事業を行っている方に向いていると思います。

サイトリニューアルに伴いStudioへ移行する案件では、お客様から「以前制作したときよりもスムーズに進んだ」と評価いただくことが多いです。

──Studioで効率的にWebデザインを作る流れについて教えてください。

影山：まず、Studioでワイヤーフレームを作成するところから始めます。この段階で、できるだけ精度を高めておくことで、その後の工程がスムーズになります。

例えば、見出しコピーの長さや本文の文章量などによっても、見やすいデザインは異なるので、私は自分で文章も書くことから、ワイヤーフレームの段階で文章はダミーではなく一通り入れるようにしています。

精度の高いワイヤーフレームをつくることでクライアントも最終的なデザインのイメージがつきやすくなり、納得感や安心感をもってもらえますので、デザインのご提案後に大きな修正が入ることなく、公開まで進めていくことができます。

▲Studioで制作したワイヤーフレームの例

──クライアントとのやりとりもStudioで行うのでしょうか？

影山：そうですね。Studioにはコメント機能があるので、お客様には直接ワイヤーフレームのプロジェクトを共有してフィードバックをいただくことが多いです。Studio上でコミュニケーションが完結するので、やりとりも非常にスムーズです。

お客様からOKをいただいた後は、ワイヤーフレームのページを複製した上でデザインを進めます。具体的なデザインや、その先の実装に取り掛かるときにも、初期フェーズで作ったワイヤーやレイヤー構造がガイドラインになってくれるので、作業効率が良いと感じます。

──ある意味、ワイヤーフレームとデザイン、実装がシームレスにつながっているのですね。

影山：そうですね。Studioでは最終的なアウトプットを見据えた精度の高いワイヤーフレームが作れるので、ワイヤーフレーム・デザイン・実装を同時並行で進めている感覚で作業できます。

特にグラフィック出身の私にとっては、この一体感がとても使いやすいです。ワイヤーフレームをきっちり作っておけば、デザイン作業も非常にスムーズに進みますし、最終的なデザインの質が安定します。

グラフィックからWebへの一歩はStudioがおすすめ

──グラフィック出身でWebが未経験のデザイナーにとって、Studioは使いやすいツールだと思いますか？

影山：そう思います。以前はグラフィックデザイナーがWebに進出するハードルは今よりも高かったかもしれません。でも今はStudioを使うことで、グラフィックデザインのように細部まで自分でデザインを表現できます。

Studioは無料で試せるプランもありますし、ヘルプセンターも充実しているので、学ぶハードルは低いと思います。コーディングの知識がなくてもWebサイトを作れる点も大きなメリットなので、グラフィックデザイナーでWebもやってみたいという方はぜひStudioを使ってみてほしいですね。

──最後に、今後Studioを使ったサイト制作で挑戦したいことを教えてください。

影山：これまでも、これからも変わらずに、その会社や人が持つ唯一無二の魅力が最大限に伝わるサイトを創り続けたいと考えています。

自分自身の表現欲を満たすためではなく、お客様の挑戦を後押しするためにWebサイトをはじめとする様々なデザインを通じてサポートしていきたいですね。

影山さんが実践するStudio完結型のWeb制作プロセスは、単なる制作の効率化だけを目指したものではありません。さまざまな工程があるWeb制作において、クライアントの負担を減らしながらも納得感と安心感を提供するという影山さんならではのアプローチだと感じました。

「伝えたいことがあるけど、うまく伝えられていない」。そんな悩みがある方は、ぜひメアリーアンドディーンにお問い合わせください。Webサイトの制作パートナーとして、そっと背中を押してもらえるはずです。

▲メアリーアンドディーンによるWebサイト制作実績（一部）