blog ブログ

2023.08.04

HINODE ICT Labから読み解くwebデザイナー的思考

WEB#

oga

こんにちは、Webディレクターのogaです。
HINODE ICT Lab(以下Lab)について、2023年6月1日に公開してからはや2か月が経過しました。まだ使い慣れないGA4でアクセス状況をチラ見しつつ運営しています。

こちらの記事で紹介した通り、Labは日の出医療福祉グループ ICT推進部 クリエイティブ室の制作サービス紹介サイトです。
リニューアルにあたって、このサイトで達成したい目標をディレクターが提示し、制作物の見せ方・自分たちをWEB上でどうPRしていくかを各デザイナーに考えてもらいました。また、前の仕様で感じた課題も全体ディスカッションしたうえで、それらを解決するための新しいデザインを制作してもらうという流れで進めました。

結果としてデザインが採用されたのはasaのもの。
今回はそのasaに、Lab制作背景についてインタビューしました。

デザイナーへインタビュー

唐突ですし今更ですが、Labデザイン制作お疲れさまでした!
まずは自己紹介お願いしてもいいですか?

asaです。
デザイン経験は15年以上、これまでに制作した業種は住宅・食品・衣料・車・医療・介護・保育などで、制作できるものはDTP・WEBデザイン、コーディング、動画制作です。

ありがとうございます!
2021年に一時的に人材不足状態に陥っていた私たちとしては、経験豊富で落ち着いたasaの応募に非常に安心した覚えがあります。
Labのデザインについてですが、テーマカラーはどう決めましたか?

色は、グレージュをベースにアクセントでオレンジを入れました。
グレー系で全体のトーンを少し落ち着かせつつ、アクセントに日の出医療福祉グループのカラーを踏襲してインハウスの制作チーム感を醸しました。

アクセントカラーが同じだと本サイトとの統一感が生まれますもんね。
今回、内部コンペというのもあり見本デザインページをディレクターから指示しませんでしたが、このサイトを手本に、などありましたか?

「特定のこのサイトを参考に」というのではなく、いろんなサイトを見て徐々にイメージを固めていきましたね。なので最初の方向性を固めるところがやや大変でした。ある程度決まってしまえば一気に進みました。
まずはメインとなるトップページのデザインを固めたのが今回も普段も行っていることです。

今回サイト内のテキストライティングもかなり甘えてしまいましたね(^^;)。
デザインとしてはポップで明るいながら、ちゃんとしているというか、そういう安定感が感じられる仕上がりとなりました。細かく見ても統一感があって隙のないサイトができたと思います!
デザイン面でほかに気を付けたことはありますか?

僕自身がコーディングもする人間なので、webデザインをするときは常にコーディングするときのことも意識して作ります。なのでLabではコーディングしやすいように、あんまり自由にデザインせずにエリアを区切って規則性を持たせてレイアウトしました。

ほほう

全体通しての話なので…なんとも説明しにくいですが…。

いやいや!大丈夫です。
ディレクターとしても、webデザイナーには一定ラインのコーディング知識は持っていてほしいと思います。コンテンツごとのまとまりとか、デバイスごとの展開とか、考えてほしい要素は多く、感覚ですべて処理するのは不可能かなと。

そもそもデザインの仕事ってどんな感じですか?

続けて、デザイナーとしての思考について紐解いていきたいと思います。
現在、DTPとwebを半々か、少しwebが多いかも?という配分で行ってもらっていますが、そもそもデザインについて社会人になってからはどうやって勉強しましたか?

15年以上デザイナーとして働いていて、時代に合わせて新しいデザインも生まれてきますし、わからないこともできます。そういったときは独学で勉強してきましたね。
気になること、やりたいことがあればとにかくまず調べるの繰り返しです。

webのコーディングも、完全に独学で学んで2~3年で現在のレベルということでしたもんね…脱帽です…!特にアニメーション使いには毎度テンション上げさせてもらっています(asaコーディングのwebページ)。
webデザインをする際に意識したほうがいいことを教えてください。

紙はスペース(サイズ)が決まっているのに対してwebは基本無制限。いくらでも情報を載せられる分、情報の整理・カテゴリ分けをしっかりする必要があります。
また紙・webともにいえるのは、「メリハリをつける」・「余白の使い方」・「なるべく色数は減らす」などですね。

紙のデザイン、webデザイン、コーディングを身に着けているデザイナーは貴重ですし、即戦力だと思います。
ところで個人的に好きなデザインとかはありますか?

好みなのはスタイリッシュなデザインですね。とはいえデザインは内容によって方向性が決まるので、ある程度どんなデザインでも対応可能です。

うれしい回答をありがとうございます!
最後に、個人的な今後の目標を教えてください。

デザインやコーディング技術など、新しいものを積極的に取り入れていきたいです。

いっすね!ありがとうございました!!

「webデザイナー的思考」を総括

普段基本的にオフィスで各々が黙々と作業をしているので、このようにじっくり聞けてよかったです。今後もこの方法でコラムを楽しく楽にこなしていこうと心底思いました。

さて、今回asaへのインタビューから感じた「webデザイナー的思考」についてまとめました。

・デザインの際はメインとなるトップページから固める
・コーディングのことも意識してデザインする
・(上記のために、たとえば具体的には)自由すぎるデザインは避け、規則性を持たせる
・気になること、やりたいことがあればとにかくまず調べる
・情報量が無限に増やせる分、情報の整理・カテゴリ分けをしっかりする
・様々なデザインへ対応する心構え
・新しいものを積極的に取り入れていく気持ち

ディレクターとして上記をwebデザイナーには標準装備としてほしいと思います。
さらにいえば、「広い好奇心を持つ」も加えたいですね。
あらゆるものに関心を持ち、それをどう表現するか、どう見せたらいいかを一緒に考えてくれるデザイナーは非常に心強いです!

今回インタビューに答えてくれたasaのプロフィールページはこちらから!制作実績と投稿したブログ記事が確認できます。
ブログについては紙とwebでのデザイン基礎等について分かりやすく書いてくれていますので、これからデザイナーを目指す方はもちろん、いまデザイナーとして働いている方にもおすすめです(^^)

HINODE ICT Labはデザイン力にも自信があります

HINODE ICT Labはデザイナーが3名在籍し、個々のデザイナーによって制作物のテイストが異なります。もちろん3名とも全般のデザインテイストに対応してもらっていますが、「そもそもどんなデザインがいいのかもわからない…!」という場合は内部コンペありきでのご発注も可能です!

ぜひお気軽にご相談くださいませ。

posted article 投稿記事

  • 【初心者向け】実務で使える便利な機能5選(コーディング編)

    2024.09.12

    【初心者向け】実務で使える便利な機能5選(コーディング編)

    WEB
  • 【CSS】カード型レイアウトは「flex」or「grid」どっちがいい?

    2024.06.15

    【CSS】カード型レイアウトは「flex」or「grid」どっちがいい?

    WEB
  • スライダーライブラリ「Splide」を使ってみた

    2024.04.10

    スライダーライブラリ「Splide」を使ってみた

    WEB
  • PHP7からPHP8へのバージョンアップでエラー発生?

    2024.01.30

    PHP7からPHP8へのバージョンアップでエラー発生?

    WEB
View more

contact お問い合わせ・ご相談

制作のご依頼や予算のお見積りなど、まずはお気軽にお問い合わせください。

contact