Works

制作物

2022
Jun


ミニイク株式会社様
企業サイトリニューアル

Visit Site 外部リンク矢印

ミニイク株式会社様サイトのモックアップ。デスクトップ、タブレット、スマホ上でトップページを表示しています。

担当
Design / STUDIO
ツール
Figma / Photoshop / STUDIO
期間
5週間

ミニイク株式会社様にWebデザイナーとして在籍しておりました際に企業サイトのリニューアルを担当いたしました。

保守や公開までのスピードの速さから今回はノーコードツールであるSTUDIOを使用しデザインから実装までを担当いたしました。
(カルテシステムサービスLP以外のページを担当。)


クライアント情報

  • 動物病院向けのクラウド型電子カルテシステムの開発、提供を行っているスタートアップSaaS企業様。
  • カルテシステムの他に動物病院向けにコンサルティング、Webサイト制作も行っている企業様。
  • カルテシステムのリリースに合わせ、企業のミッションビジョンバリューを伝えられ、サービス紹介や求人募集を掲載した企業サイトを作成したい。

コンバージョン

  • 企業のミッション・ビジョン・バリューを伝えられる事ができるように。
  • カルテシステムのLPから企業サイトを見て獣医師様や投資家様にどのような企業かを知ってもらう。
  • 求人募集も行いたいので弊社での働き方や理念を理解していただけるサイトにしたい。

ターゲット

獣医師様をメインターゲットといたしました。
30代後半〜40代。独立、新規開業を検討している獣医師様で業務の合間や自宅でスマホから閲覧する事も多いと想定しております。

ファーストビュー。メインビジュアルにジャックラッセルテリアを使用している。

企業のキャラクターを伝える。

ミニイク株式会社様は動物業界の改善から始まった企業様です。
トップにビジョンのメッセージを大きく掲載し、メインビジュアルには企業のキャラクターを体現した様な性格のジャックラッセルテリアの写真を使用いたしました。この犬種は小さい体ですが、とてもパワーがあり元気いっぱいな犬種です。

アクセントカラーに使用しているオレンジは、社内メンバー全員で「ヒーローといえば何色?」などと検討を重ね決定した色です。ぱきっとはっきりした色ですのでこちらをアクセントカラーにしボタンや強調したい部分に使用いたしました。

右側には問い合わせフォームへのボタンを設置しております。どのタイミングでも問い合わせを行い、カルテシステムやWebサイト制作の問い合わせができる様にしております。

セクション間を肉球が右上から左下へ動いて行くアニメーションのスクリーンショット

スクロールを促すアニメーション

セクション間にはスクロールを促すアニメーションを配置いたしました。

右上から左下へと、てくてく犬が歩いて行く様子が思い浮かぶように数値を調整しながら実装いたしました。これにより目線を誘導しスクロールを促す事ができたかと思います。

求人募集ページのカルチャーや働き方を掲載したスクリーンショット。ブロックごとにわかりやすく掲載した。

企業のカルチャーや働き方をわかりやすく

求人募集ページでは、カルチャーや働く環境をカード形式に掲載し、ぱっとわかりやすくいたしました。

カルチャー部分は左右交互に、働く環境セクションは左から順に下から表示されるアニメーションをつけ変化をつけています。

今回初めてではありましたがSTUDIOにてサイト制作を行いました。
STUDIO独特の実装方法やできる事できない事があり悩む場面も多々ありました。

手軽にサイトが作れると言われているノーコードツールですが、制限が多い面あるので、その中でいかにうまくデザインをしていくか、レスポンシブを実装するかは、さらにデザイン力や経験値が必要だと痛感いたしました。

今回、社員メンバーと共に美女ンミッションバリューやコーポレートカラーを話し合い制作いたしました。ライティング部分でも悩む面は多々ありましたが、サポートもいただき、ミニイク株式会社様のキャラクターを表現できるサイトが完成いたしました。

angeldogs様サイトのスマホ版モックアップ写真

Other Works

制作物