1
/
5

「コーポレートサイトリニューアルの舞台裏」二人のデザイナーにインタビューしました!

メディフォンでは、2021年の11月に、設立以後初のコーポレートサイトリニューアルを行いました。しかも写真やサイト制作など全て自社内製。今回は、そのリニューアルに関してメインで取り組んでいただいたデザイナーのお二人に、制作時の苦労や工夫点、想いなど、サイト制作の裏側と、是非皆さんにみていただきたいおススメポイントなどをお伺いしました!


池口芙有子(いけぐち ふゆこ)
専門学校にてWebエンジニアリング専攻。卒業後はWeb制作会社にてサイト制作・運用に関わる。2019年7月よりメディフォンに参画。その後は遠隔医療通訳システム「my mediPhone」のデザイン・システム構築・改善に関わり、プロダクトメンバーと共に2020年GOOD DESIGN AWARD受賞。現在はプロダクトマネージャーとして主に新サービス「your mediPhone」のUI/UXデザインとプロダクト全体のディレクションを行っている。
須藤竜二(すとう りゅうじ)
東京デザインプレックス研究所にてDTP/Webデザインコースを修了。卒業後はアーティストの制作補助をしながらフリーのグラフィックデザイナーとして活動。その後、美容製品の販売・開発事業を行う企業にて、グラフィック/webのインハウスデザイナーとして勤務。2021年の7月よりメディフォン株式会社にてUIデザイナーとして参画し、現在はデザイナーとして、コーポレートに関するデザイン周りの業務や、自社開発をしている人事・労務向けSaasプロダクト「your mediPhone」のUIデザインなどに携わっている。

目次

1.リニューアルを行うことになった背景
2.リニューアルに際し、苦労したこと、工夫点
3.お気に入り・推したいページ紹介


1.リニューアルを行うことになった背景について教えて下さい

【須藤】現状だと、企業情報とプロダクトの詳細情報がごちゃ混ぜになっており、企業情報をしっかりと伝えられていないサイトになっていました。そのため今回は企業情報とプロダクト情報をしっかりと切り分け、コーポレートサイトの立ち位置をハッキリさせる目的で制作が始まりました。

また、プロダクトに興味をもって、いったいどんな会社がこのプロダクトを運営しているんだろう?とコーポレートサイトを見に来てくれた人に対して信頼感を与えられるようなサイトにしたいという思いもありました。

【池口】「your mediPhone」 という新サービスをリリースしているのですが、これまでのコーポレートサイトは、以前からあるサービスのみ詳細に掲載しているサイトでした。須藤さんがおっしゃっていますが、サービスサイトとコーポレートサイトを分け、メディフォン株式会社についての情報を知りたい方に向けて、情報を整理するべきだと考えて、リニューアルすることにしました。

2リニューアルに際し、苦労したこと・工夫したことを教えてください

≫まずフルリニューアルということで、苦労も多かったと思います。どのような点が難しかったでしょうか?

【須藤】個人的には、まずチームで協力してサイトを制作するという部分です制作には複数のメンバーが関わっていました。今まで、1人でデザイン制作やサイト制作をしてきた私にとって、複数人で一つのサイトを制作する経験は初めてでした。gitやSassを使用して複数人でログやコードを管理したのですが、初めて使用するツールだったので、業務で生かせるレベルになるまでしばらく苦労しました。


また、デザインを担当するだけでなくコーディングにも携わったことです。コーディングの面では、他のメンバーに助けられることが多く、最初から最後まで試行錯誤の繰り返しでした。今まで自己流気味にやっていたマークアップもルールに従って行わなければならず、まずはそのルールを理解することから始まったのですが、慣れていないこともあり、最初は苦労しました。

そしてサイト全体を通して大変だったことは、皆んなの「これやりたい」に答えながらデザインを整えることですキービジュアルはwebサイトの第一印象を決める大事な要素です。そのビジュアルをどうしようか、デザインをfixする最後まで決まりませんでした。ここは今後も修正が必要な箇所だと思います。また、最初はサイトの立ち位置、社長の澤田さんや他の皆さんが考えていること、実現したいことをキチンと理解出来ておらず、思ったようなアウトプットが出来ていませんでした。途中で大幅なデザイン変更をしたこともありデザインfixまで思った以上に時間がかかってしまいました。

池口さんはどうでしょうか?

【池口】私も開発部全体での共同作業には慣れているのですが、デザイナーとフロントエンドエンジニアのみのチーム編成が、社内では今回初めてでした。最初は、デザイナー兼フロントエンドエンジニア2人だけの稼働で完結させようとしていたのですが、「your mediPhone」 トップのリニューアルと時期を合わせたいという話が出たこともあり、4人チームで共同作業をしていただき、オープンを早めることになりました。

共同作業をするための環境を構築することになり、最初は予定になかった稼働時間が発生し、ハラハラしましたが、チーム全体の良い経験になったと思います。


【須藤】そうですね公開ギリギリのタイミングでうまく画像が表示されないというハプニングもあったりしながらも、フロントエンジニアの岩渕さんやその他チームメンバーの協力のもと、無事に公開までたどり着くことができ、自分自身もチームにとっても勉強になりましたし、チームにとっても今後の参考に繋がったと思います。

≫その中でもサイト制作において、どのような工夫をされましたか?

【須藤】サイト全体の統一感、伝えたい事を視覚で伝えられるようなレイアウト作りを工夫してとりくみました。

医療関係の事業ということもあり、全体的に信頼感は残しつつ、スッキリとした見た目のデザインを目指しました。それを実現するために、ページの要素と要素のマージン幅を大きくとって、空気の流れをつくってあげたり、閲覧した時に窮屈さを感じないようにレイアウトをするように気をつけました。私のデザインは放っておくと柔らかいデザインによりがちで、澤田さんからカッチリした印象も残したいと言われたので、柔らかくなりすぎないように、気をつけながらメリハリをつけるところはつけてデザインをしてみました。

最初は要素の角に丸みをもたせたり、アクセントとして円を背景に配置したりしていたのですが、途中で変更し、四角をモチーフにレイアウトを組み直しました。採用ページに関しては、見ていて楽しい気持ちになるように、どんな社員が働いているか一目でわかるように画像をたくさん使って、見に来てくれた求職者に会社の雰囲気が少しでも伝えられるようにデザインしております。

【池口】様々な部署や経営陣から多様な意見が出る中、メインとして担当してくださった須藤さんは複数のデザイン案を作成してくださり、またデザイナーチームのメンバーも、「これは削除」「これは追加してみよう」と何回もお話しながら実際に見える形にして社内にフィードバックを行いながら、試行錯誤して作っていきましたね。


3.皆さんのおかげで、素敵なサイトになりました!最後に、特にお気に入りのページ・推したいページを教えてください

【須藤】一番思い入れのあるページは採用ページです。今回は社員紹介の写真を撮るために、ディレクションやロケハン、画像修正も担当させてもらい、とても勉強になりましたし、それだけ苦労したページなので愛着があります。その他にも遠隔医療通訳サービス「my mediPhone」のプロダクトサイトも新しく一から作成したので気に入っています。



【池口】
わたしも採用ページです。須藤さんと(撮影を担当してくださった小田さん)、人事の池田さんの尽力があり、とても魅力的な写真がたくさん掲載されています。
それぞれのキャラクターが上手く撮れていて、見ていて楽しいページですね!是非多くの方に見ていただきたいです!



真夏に一緒に撮影に出かけた日々が懐かしいです!

デザイナーチームのサイト制作への苦労と愛情を知ることのできるインタビューになりました。 これからもより素敵になっていくメディフォンコーポレートサイトをお楽しみに!

須藤さん、池口さんありがとうございました!

~~そんな池口さん・須藤さんなどデザイナーチーム含むプロダクトメンバーと一緒に、新しいサービス開発を行ってくれる仲間を募集しております!応募お待ちしております!~~

フロントエンドエンジニア
予防医療SaaSの開発チームがフロントエンドエンジニアを追加募集!
◤ ~『新しい社会の医療インフラを創る』~ メディフォンでは前身のNPO時代から 『医療における言語障壁を解消する』 ことをMissionとし、言語を理由に医療を受けられない・不安を強いられている外国人患者さんのために、専門的な医療知識を有する医療通訳サービスを開発、提供してきました。 これが、「メディフォン(medi phone)」の社名の由来です。 創業後の4年間で我々の医療通訳SaaSは全国約88,000の医療機関に導入されるまで成長。コロナ禍における海外との人の往来における日常的な医療ニーズの高まりも相まって急速に拡大しています。 メディフォンの社名の由来でもある医療通訳SaaSが対前年比300%超の成長を続けている中、2021年4月から予防医療の普及を目指す新しいヘルスケアSaaS『your mediPhone』事業の立ち上げに取り組んでいます。 https://your.mediphone.jp/ 健康な人は健康で居続けられるように、病気にかかった人も重症化せず適した医療を受けられるように。 「患者」になる前から医療とのつながりを提供することで予防医療を普及させ、限られた医療リソースが有効活用されるようサービスのプラットフォーム化を実現し、「日常(予防)と医療(臨床)をつなぐ」ことを目指しています。 出自や母国語に関係なく、必要な時に・納得して医療を受けられる、新しい時代の多文化共生社会を支える「医療インフラ」となるサービスを構築することで、多様な人々が安心して暮らせる新しい社会創りに貢献していきます。 *2020年グッドデザイン賞(社会基盤システム/インフラストラクチャー)受賞。 https://www.g-mark.org/award/describe/51123
メディフォン株式会社
自社プロダクトWEBデザイナー
UI/UXチーム|ユーザーに喜び→感動を届けるヘルスケア事業
◤ ~『新しい社会の医療インフラを創る』~ メディフォンでは前身のNPO時代から 『医療における言語障壁を解消する』 ことをMissionとし、言語を理由に医療を受けられない・不安を強いられている外国人患者さんのために、専門的な医療知識を有する医療通訳サービスを開発、提供してきました。 これが、「メディフォン(medi phone)」の社名の由来です。 創業後の4年間で我々の医療通訳SaaSは全国約88,000の医療機関に導入されるまで成長。コロナ禍における海外との人の往来における日常的な医療ニーズの高まりも相まって急速に拡大しています。 メディフォンの社名の由来でもある医療通訳SaaSが対前年比300%超の成長を続けている中、2021年4月から予防医療の普及を目指す新しいヘルスケアSaaS『your mediPhone』事業の立ち上げに取り組んでいます。 https://your.mediphone.jp/ 健康な人は健康で居続けられるように、病気にかかった人も重症化せず適した医療を受けられるように。 「患者」になる前から医療とのつながりを提供することで予防医療を普及させ、限られた医療リソースが有効活用されるようサービスのプラットフォーム化を実現し、「日常(予防)と医療(臨床)をつなぐ」ことを目指しています。 出自や母国語に関係なく、必要な時に・納得して医療を受けられる、新しい時代の多文化共生社会を支える「医療インフラ」となるサービスを構築することで、多様な人々が安心して暮らせる新しい社会創りに貢献していきます。 *2020年グッドデザイン賞(社会基盤システム/インフラストラクチャー)受賞。 https://www.g-mark.org/award/describe/51123
メディフォン株式会社
Saas事業・WEBエンジニア
コードレビュー/成果重視のチームカルチャー|医療通訳・予防医療Saas開発
◤ ~『新しい社会の医療インフラを創る』~ メディフォンでは前身のNPO時代から 『医療における言語障壁を解消する』 ことをMissionとし、言語を理由に医療を受けられない・不安を強いられている外国人患者さんのために、専門的な医療知識を有する医療通訳サービスを開発、提供してきました。 これが、「メディフォン(medi phone)」の社名の由来です。 創業後の4年間で我々の医療通訳SaaSは全国約88,000の医療機関に導入されるまで成長。コロナ禍における海外との人の往来における日常的な医療ニーズの高まりも相まって急速に拡大しています。 メディフォンの社名の由来でもある医療通訳SaaSが対前年比300%超の成長を続けている中、2021年4月から予防医療の普及を目指す新しいヘルスケアSaaS『your mediPhone』事業の立ち上げに取り組んでいます。 https://your.mediphone.jp/ 健康な人は健康で居続けられるように、病気にかかった人も重症化せず適した医療を受けられるように。 「患者」になる前から医療とのつながりを提供することで予防医療を普及させ、限られた医療リソースが有効活用されるようサービスのプラットフォーム化を実現し、「日常(予防)と医療(臨床)をつなぐ」ことを目指しています。 出自や母国語に関係なく、必要な時に・納得して医療を受けられる、新しい時代の多文化共生社会を支える「医療インフラ」となるサービスを構築することで、多様な人々が安心して暮らせる新しい社会創りに貢献していきます。 *2020年グッドデザイン賞(社会基盤システム/インフラストラクチャー)受賞。 https://www.g-mark.org/award/describe/51123
メディフォン株式会社


おまけ①:事前のロケハン

おまけ②:公園での撮影風景

《その他会社情報》
・社内イベント・社内制度の紹介等:Note
・日々の社内雰囲気、会社の文化等:Twitter会社公式@medi_phone 人事担当@ikeshu18

メディフォン株式会社では一緒に働く仲間を募集しています
11 いいね!
11 いいね!
同じタグの記事
今週のランキング
このストーリーが気になったら、直接話を聞きに行こう