Portfolio制作実績
web|site
Lapidem|official web sitedetail
Lapidem|official web sitego site
direction, design, html5+css, js+jQuery, レスポンシブ, copy write, aishipR
Lapidem様のコーポレート&ECサイトリニューアル、デザイン~実装までを担当させていただきました。実装に関しては、aishipRというCMSを使用しております
kojun sato|official web sitedetail
kojun sato|official web sitego sample
direction, design, html5+css, js+jQuery, レスポンシブ, copy write
jazz sax、佐藤公淳様の公式サイトの情報設計〜実装までを担当させていただきました。ID:nocks/PW:nocks
※事情により公開に至らずLapidem|男性用シャンプー&トリートメントdetail
Lapidem|男性用シャンプー&トリートメントgo sample
design
Lapidem様の男性用シャンプー&トリートメントのデザインを担当させていただきました。
Lapidem|Recruitdetail
Lapidem|Recruitgo sample
design, html5+css, js+jQuery, レスポンシブ
Lapidem様のリクルートページTOPおよび下層4ページのデザイン〜実装までを担当させていただきました。
Lapidem|Professionaldetail
Lapidem|Professionalgo sample
design, html5+css, js+jQuery, レスポンシブ
Lapidem様のプロユース向けサービス紹介ページのデザイン〜実装までを担当させていただきました。ガラッと変えて良い、というオーダーでしたが、既存のページとのバランスを考え、あまり離れすぎない程度に目新しさを出すよう留意しました
RIKA TANAKA|1st Album "LADY TALK" リリース & LIVE TOUR 2019detail
RIKA TANAKA|1st Album "LADY TALK" リリース & LIVE TOUR 2019go site
direction, design, html5+css, js+jQuery, レスポンシブ, copy write, WordPress
ジャズピアニスト・田中利佳様のアルバム発売記念、およびレコ発ツアー告知用サイト。フライヤー、CDジャケット&ラベルを含め、すべてのディレクション〜制作を担当いたしました。
ELECOM|サイネージ導入サービスdetail
ELECOM|サイネージ導入サービス
direction, design, html5+css, js+jQuery, レスポンシブ, copy write(一部)
企業様向けのサイネージ導入サービス。クライアント様から頂いた資料を元にワイヤーフレーム等を再構築し、BtoBに即した誠実なイメージに仕上げました。またクライアント様からいただいたテキストを元にリライトし、リード文等を作成しました。
ChinaMeets|グルメ情報サイトdetail
ChinaMeets|グルメ情報サイトgo sample site
design, html5+css, js+jQuery, レスポンシブ
日本在住の中国の方向けグルメ情報サイト。中国の方に人気の高い赤を基調に、雑多な情報をシンプルに見せることを念頭に制作しました。※虫眼鏡アイコンをクリックすると店舗一覧ページに遷移します。
CyberTech-Lab.|official web sitedetail
CyberTech-Lab.|official web site
design, html5+css, js+jQuery, レスポンシブ
新規独立起業に際するコーポレートサイトの新規立ち上げ案件。リクルートと銀行からの融資の引き出しを主目的とし、白黒で、とのオーダーのもと、グレイッシュに仕上げました。
S1 that's write|official web sitedetail
S1 that's write|official web sitego site
direction, design, html5+css, js+jQuery, レスポンシブ, WordPress
ライター様のポートフォリオサイトの新規立ち上げ案件。〝制作実例をストレートに見せる〟をコンセプトに、華美な装飾を排し、シンプルなデザインにしました。各ボタンのホバーアクションやページ遷移等のアニメーションでアテンションを補完し、ブログ記事一覧のソート機能、検索機能、メールフォーム機能等を実装しました。また記事一覧は無限ループ機能を用いてスクロールごとに記事を読み込むようにし、サイト全体をWordPress化することでクライアント様自身で更新作業が行うことができるようにしました。
Klinvier Musik Akademie|official web sitedetail
Klinvier Musik Akademie|official web sitego sample
direction, design, html5+css, js+jQuery, レスポンシブ, copy write(一部)
巣鴨にある音楽教室のオフィシャルサイト新規立ち上げ。3か月ほどディスカッションを行った上で"2つのコンセプトと8つのコース"という企業コンセプトを導き出し、サイト構成等も含めてご提案いたしました。コーポレートカラーの濃いブルーをアクセント程度の使用にとどめて色数を抑え、全体をグレイッシュに仕上げ、コンテンツをしっかり読んでいただけるよう留意いたしました。ID:nocks/PW:nocks
十日市場整形外科内科|official web sitedetail
十日市場整形外科内科go sample site
design, html5+css, js+jQuery, レスポンシブ
十日市場にある医院のオフィシャルサイト。土日診療が一つの大きなアピールポイントであるためTOPの目立つ位置に配し、爽やかなブルーを基調に清潔感と信頼感に留意しつつ、アイコンや曲線を多用することでイメージが固くなりすぎないようにして、誠実ながらも安心感を与えるような表現を目指しました。
Rikako Colors|鈴木梨花子official WEB sitedetail
Rikako Colors|鈴木梨花子official WEB sitego site
direction, design, html5+css, js+jQuery, レスポンシブ, copy write(一部), WordPress
都内およびその近郊で活躍中の若手女性ジャズドラマー・鈴木梨花子様のオフィシャルサイト。ライブ集客・仕事受注・生徒獲得へ向けた前段階として、まずは"Jazz Drumer 鈴木梨花子"の人となりを見せ、鈴木梨花子ファンの醸成を主目的としました。ご本人の希望、およびJazzという題材から、手書き風のものやクラシカルなフォントを用い、えんじ色を基調に彩度を抑え、多色ながらも落ち着いたトーンで表現し、アナログ感を出しつつもノスタルジーかつシンプルにまとめました。
馬券マネジメント|official web sitedetail
馬券マネジメント|official web sitego sample site
direction, design, copy write(一部) ※PCサイトのみ。マークアップはサンプルとなります
競馬情報サイトのリニューアル。サイトオープン以降の度重なるコンテンツ追加による煩雑さの解消のため、チュートリアルコンテンツ等の追加のタイミングに合わせてリニューアルを行いました。トップページをサイトのポータルとして捉え、全体の情報の整理を行い、ユーザビリティの改善を目指しました。また各ページごとにブランディング目的、コンバージョン目的等の役割を明確にし、コンバージョンを促す施策を施しました。
馬券マネジメント|調教の匠detail
馬券マネジメント|調教の匠 go sample site(PC)
go sample site(SP)
direction, design, html5+css, js+jQuery, PC&SP site, copy write(一部)
馬券マネジメント様内での新ブランド立ち上げに伴う新規コンテンツの追加。既存のコンテンツとのグレード感の差別化を図るため、イメージカラーとして紫を配することで高貴なイメージを演出し、調教を表すストップウォッチ、プロの目線、そして調教風景をあしらったイメージ画像にて、当ブランドのコンセプトを伝えることを主目的とした。
Grand Perfecta,Inc|official web sitedetail
Grand Perfecta,Inc|official web site
design
競馬コンテンツを中心とする総合アミューズメント企業のオフィシャルウェブサイト。TOPページには競馬場のターフをイメージしたイラストを配することで業態を想起させることに留意し、コーポレートカラーであるグリーンの他に、鮮やかなブルーを用いることで、企業としての誠実感とともに、爽やかさ、若々しさ、先進性等を表現。また余計な装飾を抑えることで企業としての信憑性を高めることを念頭におきました。
UMAJIN.net|official web sitedetail
UMAJIN.net|official web site
design
競馬総合情報企業のポータルサイト。TOPページにおいて雑多な情報をコンパクトにまとめて表示することで各コンテンツへの導入となるよう留意し、またコンテンツ上部にバナーをスライドで配することにより、当週の目玉となるコンテンツへのタイムリーな誘導を行えるよう配慮しました。
REAL SELECTOR|official web sitedetail
REAL SELECTOR|official web site
design
競馬情報サービス企業のオフィシャルサイト。〝白地を生かしたデザイン〟を心がけることで信頼感、公正明大さを醸成することに留意しました。
ヒロシマの孫たち|特設サイトdetail
ヒロシマの孫たち|特設サイト
design
〝第三世代が考えるヒロシマ「 」継ぐ展〟における市民参加型朗読劇「ヒロシマの孫たち」のワークショップ&発表会の特設サイト。ゆかりの画家様からいただいた絵を生かしつつ、優しさ、柔らかさを表現することに留意しました。また、すべて絵画内の色を用いて配色を行い、絵との親和性を損なわないよう配慮しました。
web|landing page
KADOKAWA|AICHI IMPACT!2019×FORTNITE 特設サイトdetail
KADOKAWA|AICHI IMPACT!2019×FORTNITE 特設サイトgo sample
design, html5+css, js+jQuery
ID:nocks/PW:nocks
KADOKAWA|コンパス甲子園 スマートフォン用特設サイトdetail
KADOKAWA|コンパス甲子園 スマートフォン用特設サイトgo site
design, html5+css, js+jQuery
KADOKAWA|白猫プロジェクト/ファンミーティング2018App公式攻略DBdetail
KADOKAWA|白猫プロジェクト/ファンミーティング2018App公式攻略DBgo sample site
design, html5+css, js+jQuery, レスポンシブ
KADOKAWA|カゲロウデイズ ポップアップストア特設サイトdetail
KADOKAWA|カゲロウデイズ ポップアップストア特設サイトgo site
design, html5+css, js+jQuery, レスポンシブ
KADOKAWA|スプラトゥーン甲子園”公式ファンブック販売告知用特設サイトdetail
KADOKAWA|スプラトゥーン甲子園”公式ファンブック販売告知用特設サイトgo site
design, html5+css, js+jQuery, レスポンシブ
アニメイトガールズフェスティバル2016detail
アニメイトガールズフェスティバル2016go sample site
design, html5+css, js+jQuery, レスポンシブ
ファミ通|TOKYO GAME SHOW 2016detail
ファミ通|TOKYO GAME SHOW 2016go sample site
design, html5+css, js+jQuery, レスポンシブ
馬券マネジメント|究極指数detail
馬券マネジメント|究極指数go sample site
direction, design, html5+css, js+jQuery, レスポンシブ, copy write(一部)
同時期に某スポーツ紙に掲載された5週連続広告と連動し、新聞広告から来訪したユーザーをメール会員登録へと促すことを主目的とした。『究極指数』という共通のキーワードを前面に出し、広告の内容をより深く掘り下げるように構成。
馬券マネジメント|競馬Compassdetail
馬券マネジメント|競馬Compassgo sample site
direction, design, html5+css, js+jQuery, レスポンシブ, copy write(一部)
馬券マネジメントと競馬Compassとの協業体制締結に際して、競馬Compassユーザーを馬券マネジメント入会へと促すことを主目的として制作。競馬CompassのIDとパスワードでログイン可能という簡易性を伝えることを第一の目的とし、その上で競馬Compassユーザーにとってのベネフィットを伝えることに留意して構成案を提案いたしました。
web|banner & more
馬券マネジメント|コンテンツ促しバナー『フェブラリーS』detail
馬券マネジメント|コンテンツ促しバナー『フェブラリーS』
design, copywrite
オウンドメディアのメインビジュアルに使用する、コンテンツ遷移促進を促すバナー。春GI初戦への期待感・躍動感を表現しました
馬券マネジメント|コンテンツ促しバナー『秋競馬開幕』detail
馬券マネジメント|コンテンツ促しバナー『秋競馬開幕』
design, copywrite
オウンドメディアのメインビジュアルに使用する、コンテンツ遷移促進を促すバナー。季節感を出す、というクライアント様の要望と、競馬の迫力を表現することに留意しました
馬券マネジメント|コンテンツ促しバナー『秋の「中山」2歳短距離戦』detail
馬券マネジメント|コンテンツ促しバナー『秋の「中山」2歳短距離戦』
design, copywrite
オウンドメディアのメインビジュアルに使用する、コンテンツ遷移促進を促すバナー。「2短」というキーワードへの意識づけと、当イベントへの期待感を表現することに留意しました
馬券マネジメント|コンテンツ促しバナー『ドル箱開催「東京」』detail
馬券マネジメント|コンテンツ促しバナー『ドル箱開催「東京」』
design, copywrite
オウンドメディアのメインビジュアルに使用する、コンテンツ遷移促進を促すバナー。「儲かりそう」「勝てそう」といった雰囲気を醸成することに留意しました
馬券マネジメント|コンテンツ促しバナー『GIプラン「桜花賞」』detail
馬券マネジメント|コンテンツ促しバナー『GIプラン「桜花賞」』
design, copywrite
オウンドメディアのメインビジュアルに使用する、コンテンツ遷移促進を促すバナー。クライアント様のストロングポイントである「データ解析」と、GIレースのプレミアム感を表現することに留意しました
馬券マネジメント|コンテンツ促しバナー『短期集中提供パック』detail
馬券マネジメント|コンテンツ促しバナー『短期集中提供パック』
design, copywrite
オウンドメディアのメインビジュアルに使用する、コンテンツ遷移促進を促すバナー。レギュラー商品なので、コンスタントに右肩上がりで収益を上げているということと、直近の収支結果を明快に伝える、という点に留意しました
User Local|facebookバナー #01『web解析、次の一手』detail
User Local|facebookバナー #01『web解析、次の一手』
design, copywrite
ヒートマップWEB解析等を行っているUser Local様のアクセス解析ツール、User Insightのfacebookバナー。『web解析、次の一手』=ヒートマップWEB解析と位置づけ、ヒートマップ画面とマウスを持つ手を配してイメージを作成しました。
User Local|facebookバナー #02『顧客心理は可視化できる』detail
User Local|facebookバナー #02『顧客心理は可視化できる』
design, copywrite
ヒートマップWEB解析等を行っているUser Local様のアクセス解析ツール、User Insightのfacebookバナー。ヒートマップ解析でユーザーのサイト内での行動を“見える化”する、ということを訴求ポイントと捉え、瞳のイメージを元にイメージを作成しました。
User Local|facebookバナー #03『ユーザー属性を直感解析』detail
User Local|facebookバナー #03『ユーザー属性を直感解析』
design, copywrite
ヒートマップWEB解析等を行っているUser Local様のアクセス解析ツール、User Insightのfacebookバナー。ユーザーを直感的、簡単に解析できる使いやすいツールであることを訴求ポイントと捉え、普段は見えづらい顧客心理をヒートマップを使って可視化する、ということを表現するよう留意しました。
User Local|facebookバナー #04『サイト改善の答えがここにある』detail
User Local|facebookバナー #04『サイト改善の答えがここにある』
design, copywrite
ヒートマップWEB解析等を行っているUser Local様のアクセス解析ツール、User Insightのfacebookバナー。サイトの改善点が見えずに難儀している企業のWEB担当者様をメインターゲットとし、ヒートマップ解析による業務改善の一助となることを訴求することを主眼としました。
User Local|facebookバナー #05『“勝てるサイト”とは、何か?』detail
User Local|facebookバナー #05『“勝てるサイト”とは、何か?』
design, copywrite
ヒートマップWEB解析等を行っているUser Local様のアクセス解析ツール、User Insightのfacebookバナー。“勝てるサイト”とは、何か?の答えがUser Insightである、ということを訴求ポイントとし、ヒートマップ解析によって業績が向上することを念頭にイメージを作成しました。
馬券マネジメント|各コンテンツ促し3連スライドバナーdetail
馬券マネジメント|各コンテンツ促し3連スライドバナー
direction, design
オフィシャルサイトリニューアルによる新規コンテンツへの導線となるバナー。当サービスのコンセプトを『投資競馬』と位置づけ、そのストロングポイントを3つにまとめて、それぞれの各コンテンツ説明部分に遷移を促すことを主眼としました。
UMAJIN.net|各コンテンツ促しスライドバナー #01〜#04detail
UMAJIN.net|各コンテンツ促しスライドバナー #01〜#04
design
サイトTOPから各コンテンツへの遷移を促すスライドバナー。#01はアプリをダウンロードしてもらうことを主眼としています。
graphics|logotype & symbol mark
ザイプロ|Corporate logotypedetail
ザイプロ|Corporate logotype
direction, design
〝力強さと、躍動感〟
少し懐かしさを感じさせるようなアナログ感
ユニクロのカタカナロゴ等をイメージし、現代的なものの中に近代的なイメージを内包することで、若い人から中高年層まで幅広い訴求を目指しました。また骨太のフォルムで力強さ、また競馬のスピード感等を表現しました。
degital hollywood|STUDIO CARAVAN logotypedetail
degital hollywood|STUDIO CARAVAN logotype
direction, design
〝新たな『歴史』を作るデジタルハリウッド〟
古いタイプライター書体を模したトラディショナルなパターン
アメリカのクラシカルな書体をモチーフに用いることで、〝ハリウッド〟とのイメージの紐付けを行うとともに、カジュアルながらもこれまでの歩みから醸し出される歴史の重みを感じさせるイメージを表現。また、ユーザー様に対して〝新たな人生の『歴史』を提供する〟というコンセプトのもと、アメリカンカジュアルな親しみやすさ、開拓期の躍動感等を表現しました。配色については、〝WorketCareer〟〝SUGIYAMASTYLE〟〝JointApps〟〝デジタルスケープ〟とのバッティングに留意しながら.よりフレッシュさを強調しました。
replan|official logotypedetail
replan|official logotype
direction, design
〝洗練・知的・誠実〟
鮮やかなブルーをコーポレートカラーとし、伝統的、古典的なタイプフェイスとなるよう留意することで格調高さ、誠実感を表現。またウエイトを重くなりすぎないように留意することと、セリフに流れを持たせることで、洗練された、知的なイメージを加味しました。
心泉社|official logotypedetail
心泉社|official logotype
design
〝重厚さとモダンさ〟
出版社さまの企業ロゴタイプ。歴史の重さを感じつつもモダンさを兼ね備えた、クライアント様の先進性を表現しました。
Linkheadts|official logotype & symbol markdetail
Linkheadts|official logotype & symbol mark
direction, design
〝お客さまの心を繋ぐ、Linkhearts〟
音楽制作プロダクション様のオフィシャルロゴ。〝お客さまの心を繋ぐ〟というコンセプトをシンボルマークで表現。太めのセリフ体をモチーフにすることで、クラシカルな軽やかさに組織としての堅牢性を加味して制作しました。
graphics|advertising
WAO! Corporation|京王線・小田急線窓上広告detail
WAO! Corporation|京王線・小田急線窓上広告
direction, design, copy write
デジタルクリエイターカレッジ・WAO!様の生徒募集広告。学生の顔写真を使用するリアルさと、極力雑多な事例を上げることで、『クリエイターになりたいと思うこと』が重要と説き、『きみのクリエイティブマインドを刺激する』という文言で落とし込みを狙いました。新宿駅発着の京王線・小田急線の窓上広告として数ヶ月間掲載ののち、横浜市内のバス路線のラッピング広告に転用されました。
TAU HongKong|新聞タブロイド版1/4広告detail
media21 gallery|雑誌掲載広告detail
media21 gallery|雑誌掲載広告
design, copy write(一部)
デザイン、及び注釈以外のコピーライティングを担当。当時10代にしてピカソを彷彿とさせる画風の画家を『ピカソの再来』と捉え、『時代は再びピカソを求めた。』とすることで認知度を高め、問い合わせを受けることで今後のプロモーションに繋げていくことを主眼として制作いたしました。
馬券マネジメント|東京スポーツ半3段つかみ広告 #01detail
馬券マネジメント|東京スポーツ半3段つかみ広告 #01
direction, design, copy write(一部)
馬券マネジメント社サイトリニューアルおよび競馬Compassとの協業体制締結に合わせたプロモーションの一環で、そのうちの新聞広告出稿の第一弾(その他ランディングページを制作)。両者の共通項である〝指数〟をキーワードに、競馬ファンの中でも特に〝指数好き〟にターゲットを絞った訴求を行い、従来の指数からの大幅グレードアップ感をその的中実績とともに伝えることを主眼としました。また、〝究極指数〟〝投資競馬〟といった新たなキーワードを提示することで、今後のプロモーションに繋げていくことも念頭において提案しました。
馬券マネジメント|東京スポーツ半3段つかみ広告 #02detail
馬券マネジメント|東京スポーツ半3段つかみ広告 #02
direction, design, copy write(一部)
馬券マネジメント社サイトリニューアルおよび競馬Compassとの協業体制締結に合わせたプロモーションの一環で、そのうちの新聞広告出稿の第二弾。ランディングページ、オフィシャルサイトのスライドバナーで使用したものと同じ〝究極指数〟のアイコンを用いることでイメージの統一を図り、従来の、競馬関係者の経験や相馬眼、カン、あるいは関係者の裏情報などに頼った予想法に疑問を感じているユーザーにターゲットを絞り、〝客観性〟という新たなキーワードを提示することで訴求を図るよう提案しました。また、グレードアップ感とその高揚感を上向きの矢印で表現しました。
馬券マネジメント|東京スポーツ半3段つかみ広告 #03detail
馬券マネジメント|東京スポーツ半3段つかみ広告 #03
direction, design, copy write(一部)
馬券マネジメント社サイトリニューアルおよび競馬Compassとの協業体制締結に合わせたプロモーションの一環で、そのうちの新聞広告出稿の第三弾。〝究極指数〟のアイコンをより強く印象付け、前2回の出稿で未だにためらっているユーザーに対して〝なぜ、馬券に「データ」をフル活用しないのか?〟と問いかけ、さらにこれを〝新時代の馬券投資法〟とすることで新規の顧客を獲得することを主目的として制作しました。
馬券マネジメント|東京スポーツ半3段つかみ広告 #04detail
馬券マネジメント|東京スポーツ半3段つかみ広告 #04
direction, design, copy write(一部)
馬券マネジメント社サイトリニューアルおよび競馬Compassとの協業体制締結に合わせたプロモーションの一環で、そのうちの新聞広告出稿の第四弾。指数は〝難しそう〟〝面倒くさそう〟などという印象を持っているユーザーに対し、その平易性を解くことで顧客獲得を目指して制作しました。また、十分高い収益性が見込めることを〝データ方程式〟といったキャッチ、および過去の実績を挙げることで訴求しました。
ECO LOVIE|森・呼・吸 通販カタログ掲載広告detail
graphics|flyer
RIKA TANAKA|1st Album "LADY TALK" リリース告知 & LIVE TOUR2019 flyerdetail
DUB & SATOSHI OHSUGA|A4ライブ告知flyerdetail
(株)小林企画|A4ライブ告知flyer #01detail
(株)小林企画|A4ライブ告知flyer #02detail
ECO LOVIE|イカリ消毒様A4両面flyerdetail
degital hollywood|STUDIO CARAVAN flyerdetail
graphics|& more
RIKA TANAKA|1st Album "LADY TALK" CD jacket & labeldetail
Sokehs Rock|shop card & coasterdetail
Hollywood Actors Academy|BACK STAGE プレスリリース detail
Hollywood Actors Academy|BACK STAGE プレスリリース
design
映画"BACK STAGE"のプレスリリース用パンフレット。メインイメージに合わせて全体的にブラウンを基調にまとめました。
雑誌UMAJIN|読者のパドック editorial designdetail
雑誌UMAJIN|読者のパドック editorial design
design ※A4変形見開き6P 右綴じ
競馬総合情報雑誌〝UMAJIN〟の読者投稿連載ページ。コルクボードを背景に敷くことで掲示板を想起させ、極力POPなテイストで楽しさを演出し、各コーナータイトルをアイコン化することで情報のグルーピングを意識して制作しました。
ECO LOVIE|湯ったり画像合成detail
ECO LOVIE|森・呼・吸 package designdetail
ECO LOVIE|森・呼・吸 package design
dsign
加湿器に入れることでマイナスイオン効果で活性酸素抑制ほかの効用を生み出す商品のパッケージデザイン。特色1版という制約の中、単調にならないよう留意しました。