DESIGN IT YOURSELF.

BUROKI


top

design

  • top
  • design
  • web
  • 明朝体フォントをアクセントに。IVARA LEARNのランディングページデザイン

明朝体フォントをアクセントに。IVARA LEARNのランディングページデザイン

web

  • top
  • design
  • web
  • 明朝体フォントをアクセントに。IVARA LEARNのランディングページデザイン

明朝体フォントをアクセントに。IVARA LEARNのランディングページデザイン

2025.04.09.

スポンサーリンク

スポンサーリンク

当サイトにwebの制作実績として紹介させていただいている実績は、基本的にデザインとコーディングの両方を担当させていただいた制作案件がメインなのですが、webデザインのみ提供させていただいた案件も多数ございます。

昨年夏ごろの実績になりますが、いつもお世話になっている獣医療関連の出版社であるEDUWARD Pressさまが提供する「3D解剖アトラス IVALA LEARN」のLP(ラインディングページ)デザインです。

IVALA LEARNは平面から立体(3D)での操作により、動物の骨格・筋肉・内臓などを360度観察することができ、解剖学をより身近に感じることができる革命的なサービスとなっています。元々は海外で利用されているサービスでしたが、日本でも提供が開始されることになったようで、日本版のLPデザインをお任せいただきました。

海外のページを日本向けにアレンジ

LPの内容自体は海外ですでに存在しているページを参考にし、基本的なテイストもそこから逸れることなく、日本用にアレンジして制作していきました。

メインビジュアルで訴求するメインキャッチにはwebフォントは使わず、ブランディングと訴求力を高めるため、太めの明朝体を用いてwebフォントでは再現できないタイポグラフィにて制作。

メインキャッチのタイポグラフィ
自作したメインキャッチのタイポグラフィ

タイトルやキャッチなどの文字サイズ大きめの文言に「」(カギカッコ)を使う場合は、フォントのものを使用せず罫線で表現するのが基本です。フォントのものを使うとどうしてもモッサリ感が出たり、字間が広めにとられてしまいますが、罫線にすることでよりスマートにスッキリ読ませることができます。

かなり専門的な分野であるため、提供いただいた画像の種類もあまり多くなかったのですが、その中でもできる限り、最大限活用して制作させていただきました。

特徴部分の画像デザイン
PCとスマホ別々に画像を制作

ページに使用するカラーはロゴで使用されているカラーから抽出。
メインカラーは背景にしている暗めのネイビーで、アクセントとしてグリーンやピンクなどの蛍光色を使用しました。

3D解剖アトラス IVALA LEARNのQ&Aのデザイン
アコーディオン機能のQ&A

ページ全体のゴールとしてのCTA(コール・トゥ・アクション)のデザインも背景にパターンを用いてデザイン。

3D解剖アトラス IVALA LEARNのCTAデザイン
IVALA LEARNのCTAデザイン

3D操作のためPC向けのサービスではありますが、学生さんの利用者も想定しているため、スマホデザインも同様に各要素しっかりと制作しました。

3D解剖アトラス IVALA LEARNのスマホ用ページデザイン
IVALA LEARNのスマホ用ページデザイン

今までにないサービスであることと、利用料もかかるので(学生さん以外は年間18,000円)、高級感と信頼感を出すために各領域のタイトルで使用するフォントも厳選しながら、余白も意識してページ全体を丁寧に制作。仕上がりはクライアントさまにも満足していただくことができました。

今回はページデザインのみでしたが、お任せくださりありがとうございました。

production list

今回のweb制作で対応した項目
  • webデザイン
  • アイコンやファビコン、矢印などのグラフィックデザイン
  • 挿絵や図のインフォグラフィック制作
  • PC、スマホ表示対応(レスポンシブデザイン)

IVALA LEARNのLPはこちらから

実際のサイトは下記のリンクよりご覧ください。
※webサイトによっては変更・クローズしてることもありますので、その際はご容赦ください。

スポンサーリンク

BUROKI写真

BUROKI写真

はじめましてBUROKIです。

ベンチャー企業にて11年間webやグラフィックデザインとブランディング経験を経て、2019年5月よりフリーランスデザイナーになりました。完全独学でフリーランスになった異色の経歴の持ち主だと思います(笑)

制作実績やインハウスデザイナーのことなど日々更新しています。デザイン制作のご依頼やお問い合わせなども受け付けてますので、なんでもお気軽にご相談ください。

ベンチャー企業でマスターデザイナーとして働いた後、フリーランスになりました。制作実績やインハウスデザイナーのことなど日々更新しています。制作のご依頼なども受け付けてますので、なんでもお気軽にご相談ください。

ご依頼・お問い合わせ

ご依頼・お問い合わせ

related contents

関連コンテンツ一覧
スポンサーリンク

文鳥とデザイナー

スポンサーリンク

design list

デザイン作品一覧

web

明朝体フォントをアクセントに。IVARA LEARNのランディングページデザイン

当サイトにwebの制作実績として紹介させていただいている実績は、基本的にデザインとコーディングの両方を担当させていただいた制作案件がメインなの…

2025.04.09.

graphic

黒の用紙に活版印刷でグレードアップ。株式会社FORGEの名刺デザイン

昨年の9月に制作実績にて紹介している株式会社FORGEさまの名刺デザイン。 ブランドの世界観をより引き立てる。株式会社FORGEの名刺デザイン 名刺のデ…

2025.04.01.

goods

創業54周年。のぼり刃物店さんのロゴデザインと缶バッジ&ステッカー

毎年恒例としてお任せいただいている制作物が、今年も完成。 きたる2025年4月1日(火)、いつもお世話になっている大阪府茨木市にあるのぼり刃物店さ…

2025.03.27.

graphic

数字で各特徴を視覚的に伝える。ハイブアイキューのフライヤーデザイン

会社員時代の元同僚が働いている株式会社ハイブアイキューさまから、会社の強みや特徴を伝えられるチラシをデザインしてほしいというご依頼をいただ…

2025.03.17.

graphic

LPの世界観をさらに広げる。キシヒロエステートのフライヤーデザイン

いつもお世話になっているパートナーの辻本さん(株式会社FORGE)からのご紹介で、昨年末に久しぶりの紙媒体のデザインを制作させていただきました。…

2025.02.25.

graphic

6周年に向けて。BUROKI designの活版印刷名刺を新しく制作しました

BUROKI designは2019年5月に開業してから早5年。6年目を迎えています。 今まで使用していた名刺ですが実は2016年ごろに制作したもので、そこから開業…

2025.01.29.

designをもっと見る

制作のご相談・お問い合わせはフォームから

デザインのご依頼や予算のご相談、お問い合わせなどお気軽にお問い合わせください。
また、書いてほしいブログのリクエストやファンレター(笑)もお待ちしております。

問い合わせフォームはこちら

topトップページ

aboutブロキについて

designデザイン

voiceお客さまの声

blogブログ

films制作動画

cassetteカセットテープ

snsソーシャル