Portfolio - 大阪市西区 Wild Cards ワイルドカーズwild-cards.net/portfolio.pdf ·...

14
Portfolio 2016

Transcript of Portfolio - 大阪市西区 Wild Cards ワイルドカーズwild-cards.net/portfolio.pdf ·...

Page 1: Portfolio - 大阪市西区 Wild Cards ワイルドカーズwild-cards.net/portfolio.pdf · 2017-05-26 · サイトの機能性・拡張性を重視のため、基本的にCMS(WordPress)を利用して制作しています。

Portfolio ~ 2016

Page 2: Portfolio - 大阪市西区 Wild Cards ワイルドカーズwild-cards.net/portfolio.pdf · 2017-05-26 · サイトの機能性・拡張性を重視のため、基本的にCMS(WordPress)を利用して制作しています。

Headline① 店舗サイト② コーポレートサイト他③ レスポンシブ対応例④ ランディングページ -1⑤ ランディングページ -2⑥ 通販サイト+カタログ⑦ バナー広告類

Web制作実績

紙媒体制作実績

広告出稿代理

企画書作成

PhotoShopIllustratorDreamWeaverさくらエディタ

・・・・・・・・・・・・

・・・・・・・・・・・・

★★★★★★★★★★★★★

★★★★★★★★★★★

使用アプリケーション

HTML5CSS3PHPjQuery

「見た目だけキレイでも人は来ない」をモットーに、制作だけでなくコンセプトメイクからゴール / マイルストーンの設定まで包括的にディレクションします。SEO/SEM、リスティング出稿管理も含め成果主義のWebコンサルタントを目指しています。

使用言語

Page 3: Portfolio - 大阪市西区 Wild Cards ワイルドカーズwild-cards.net/portfolio.pdf · 2017-05-26 · サイトの機能性・拡張性を重視のため、基本的にCMS(WordPress)を利用して制作しています。

株式会社エイチツーオー(エステサロンチェーン)

Webサイト制作実績① 店舗サイトサイトの機能性・拡張性を重視のため、基本的にCMS(WordPress)を利用して制作しています。

総20ページ/ブログあり/予約システムあり男性も利用可のサロンの為、過剰な装飾を避けクリーンで高級感あるデザインに。ホテル日航大阪31階というロケーションを最大限に活かすべくハイクラスに絞ったSEO/SEMを実践しています。http://www.t-h-n.jp/

Bar Perro(飲食店)

総5ページ/ブログあり/Facebookページ自動連携背景全体にスライド画像を用いて臨場感を演出。店主がスマートフォンから簡単にブログに投稿でき、さらに店舗のFacebookページに自動転送させて手間要らずでアナウンスできる仕組です。http://bar-perro.com/

スマホ対応

Page 4: Portfolio - 大阪市西区 Wild Cards ワイルドカーズwild-cards.net/portfolio.pdf · 2017-05-26 · サイトの機能性・拡張性を重視のため、基本的にCMS(WordPress)を利用して制作しています。

株式会社アローズ(眼科医療専門ディーラー)

Webサイト制作実績② コーポレートサイト他

総5ページ シングルページレイアウト「眼科医療の総合サポート」というコンセプトに即したスケール感を表現するため、6つのコンテンツをシングルページに収め、アンカーでページ内遷移する仕様にしています。取材、撮影、ライティングも担当しました。なお本件はすべてハンドコーディングです。

http://arrows-ophthalmic.jp/

大阪市長 吉村洋文 公式サイト

総10ページ/ブログあり/Twitter・Facebookページ自動連携納期半月・レスポンシブ・CMSというオーダーのもと、既存WordPressテーマをベースに制作。氏のキャラクターと政策方針、活動内容がシンプルに伝わる構成を心掛けました。

http://yoshimura-hirofumi.com/

スマホ対応

Page 5: Portfolio - 大阪市西区 Wild Cards ワイルドカーズwild-cards.net/portfolio.pdf · 2017-05-26 · サイトの機能性・拡張性を重視のため、基本的にCMS(WordPress)を利用して制作しています。

二永麻酔科クリニック(個人医院)

Webサイト制作実績③ レスポンシブ対応例スマートフォンやタブレットでも統一感のあるインターフェイスを維持することができます。

可変グリッドレイアウトブラウザの表示幅に合わせてコンテンツの各要素が自動で最適な配列・大きさに変化します。

シングルページ構成すべてのコンテンツを1ページに収めることで、ページ遷移によるタイムラグを無くしSEOにも有利になります。

Wild Cards(Web制作)

カラム式レイアウトブラウザの表示幅に合わせてカラム(メイン+メニュー+サブ)数を自動調整し、各デバイスでストレスフリーな閲覧を可能にします。

スライドメニュー実装スマホおよびタブレットでは、画面左上部のボタンタップでスライドメニューが出現します。

PCPC・タブレット

スマホ・タブレット

スマホ

Page 6: Portfolio - 大阪市西区 Wild Cards ワイルドカーズwild-cards.net/portfolio.pdf · 2017-05-26 · サイトの機能性・拡張性を重視のため、基本的にCMS(WordPress)を利用して制作しています。

Webサイト制作実績④ ランディングページとくにアピールしたい商品やサービスへの導線としてLPOという手法が定着しつつあります。

一般社団法人自然治癒力学校理事おのころ心平著「病気は才能」

エステサロン ル・サブリナ心斎橋「綺麗応援キャンペーン」

Page 7: Portfolio - 大阪市西区 Wild Cards ワイルドカーズwild-cards.net/portfolio.pdf · 2017-05-26 · サイトの機能性・拡張性を重視のため、基本的にCMS(WordPress)を利用して制作しています。

Webサイト制作実績⑤ ランディングページ

天真堂 エニシングホワイトプレミアムモイスチャーリンスティング広告用ランディングページ

Page 8: Portfolio - 大阪市西区 Wild Cards ワイルドカーズwild-cards.net/portfolio.pdf · 2017-05-26 · サイトの機能性・拡張性を重視のため、基本的にCMS(WordPress)を利用して制作しています。

Webサイト制作実績⑥ 通販サイト+カタログ Webサイト制作実績⑦ バナー広告類雑誌編集/DTPの経験を活かしたクロスメディアでの企画制作・ディレクションもお任せ下さい。 インタレストマッチ等の各種バナー広告に対応しています。

160×600px

300×250px

LINEタイムライン用

北海道こだわり旬鮮便

30万部のポスティング+EC冬季限定通販カタログのアートディレクション担当。約40ページのカタログと100ページ超のECサイトにおいて企画、台割、レイアウトデザイン、撮影から一部の実制作までを手掛けました。

”売る”ためのに必要なプロモーションやアドバタイズの最適解を常に模索し続けています。

一瞬のビジュアル・インパクトで誘引限られたスペースでどれだけ効果的に訴求できるか、バナー広告には独特のメソッドがあります。

Page 9: Portfolio - 大阪市西区 Wild Cards ワイルドカーズwild-cards.net/portfolio.pdf · 2017-05-26 · サイトの機能性・拡張性を重視のため、基本的にCMS(WordPress)を利用して制作しています。

紙媒体制作実績①チラシやパンフレット、店内POPから名刺まで。あらゆるサイズ・形態の販促ツールを制作します。

A4チラシ A4紙面広告 封筒折込

名刺

巻き三つ折

ポケットティッシュ

ポップ、クール、キュート、レトロ、エレガントetc...さまざまな業種業態や訴求スタイルの販促ツール制作に携わり、マーケティングの観点から多様なニーズに合わせたデザイン力を培いました。また、今後の紙媒体はいかにWebとの親和性を高めていけるかが焦点と考え、メディアミックスやソーシャルネットワークとの連携を常に念頭に置いています。

Yuich i ro Yamamoto

550-0015 4-23-21-2101 090-2599-7520 [email protected] TEL MAIL

Debut!メンズ専用ルーム完備

   男の顔痩せ!フェイススリムコース

ムクミ・たるみで膨らんだフェイスラインをすっきり引き締める小顔マッサージ。リンパマッサージ&顔痩せ専用マシンでシャープなラインの潤いのある美顔を作りあげます。

60分 ¥16,000

①クレンジングマッサージ②顔痩せ専用マシン③首・デコルテのリンパマッサージ④顔のムクミ・クスミを取るリンパマッサージ⑤潤い引き締めパック⑥ヘッドマッサージ

90分 ¥23,000

上記60分の内容+ 胸、肩、首、背中のマッサージ  or フットマッサージ

深いリラクゼーションとともに確かな効果を実感できるトリートメント。皮膚を清浄にし、テカリ、シワを改善し、栄養を閉じ込めるマスクで若々しくなめらかな肌触りに整えます。

45分 ¥13,000

①マリンソープ泡洗顔②ピーリング③ミネラルブリューム④アンチエイジング&アンチストレス成分のセラ ム (美容液)⑤フェイシャルマッサージ⑥栄養成分を浸透させるオーシャンマスク

60分 ¥16,000

上記45分の内容+ ヘッドマッサージ or フットマッサージ  or 胸、肩、首、背中のマッサージ

   男の美顔!毛穴すっきりリフレッシュコース

50%

[ ムクミ、たるみ、二重あご、小顔 ] [ テカリ防止、おシワ改善、アンチエイジング ]

最高技術のリンパマッサージで疲れやムクミ、脂肪をため込む原因となる老廃物を体外へ排出します。施術後はストレスも驚くほどスッキリ!疲れがたまっている方にオススメです。

60分 ¥14,000

①足湯②足裏~脚~背中~腕~首のリンパマッサージ③ヘッドマッサージ

90分 ¥19,000

上記60分の内容+ 全身筋肉ストレッチ+ コリ集中ほぐしマッサージ(肩・首・腕・背中)  or ヘッドマッサージ

サイズダウンを目的とした全身リンパマッサージ。脂肪溶解マシンの高周波熱でお腹の脂肪を溶かし即サイズダウンに導きます。スリミング・引き締め効果が抜群のトリートメントです。

90分 ¥21,000

①足湯②足裏~脚~背中~腕~首のマッサージ③お腹の脂肪揉捻マッサージ④脂肪溶解マシン

110分 ¥26,000

上記90分の内容+ 引締めパック

高周波熱で脂肪細胞を溶解!

   男のダイエット!スペシャル引き締めコース

[サイズダウン、たるみの除去、脂肪燃焼 ]

即サイズダウン

   男の疲労回復!リンパマッサージコース

BODY

FACE FACE

BODY

[ 疲労、コリ、ムクミ、冷え、ストレス ]

初めての方にオススメ!

初めての方にオススメ!

初めての方にオススメ!

Page 10: Portfolio - 大阪市西区 Wild Cards ワイルドカーズwild-cards.net/portfolio.pdf · 2017-05-26 · サイトの機能性・拡張性を重視のため、基本的にCMS(WordPress)を利用して制作しています。

紙媒体制作実績②チラシやパンフレット、店内POPから名刺まで。あらゆるサイズ・形態の販促ツールを制作します。

A5フライヤー チケット

Page 11: Portfolio - 大阪市西区 Wild Cards ワイルドカーズwild-cards.net/portfolio.pdf · 2017-05-26 · サイトの機能性・拡張性を重視のため、基本的にCMS(WordPress)を利用して制作しています。

GDN(Google ディスプレイネットワーク) Google が自社の検索サービスを利用して行うWeb広告の総称YDN(Yahoo! ディスプレイアドネットワーク) Yahoo! が自社の検索サービスを利用して行うWeb広告の総称

Yahoo! も Google の検索アルゴリズムを使用しているので、検索結果はほぼ同一です。ただあくまで両者は別のサービスですので、Google に広告掲載したとしても同時に Yahoo! にも掲載されるわけではありません。広告の種類・形態はどちらもほぼ同じで、下記の 7種があります。

リスティング

Google や Yahoo などの検索エンジンの検索結果ページに、検索されたキーワードと関連性の高いサイトを有料で上位に表示できる仕組みです。 キーワードごとに表示枠のオークションが行われ、掲載単価が高いものが「広告」という形で優先的に表示されます。

サイトリターゲティング(リマーケティング)

自社のサイトを訪れたことのある人に限定して、再訪を促すような広告を配信することです。ネットサーフィンする中で何度も広告が表示されるため、印象に残りやすくリピート促進に繋がりやすいと言われています。

インタレストマッチ

ユーザーが閲覧中のページ内容や興味関心(過去の閲覧履歴や検索キーワード)から、興味がありそうな商品・サービスの広告を表示させる Yahoo! の手法です。広告主はユーザーを想定して、性別・地域などを設定する事もできます。

コンテンツターゲティング

訴求したい商品やサービスに関連するキーワードを指定して広告配信する手法です。そのキーワードを含んだサイトに的確に広告が出稿できる為、アプローチが難しい潜在層ユーザーへの配信が可能です。

プレースメントターゲティング

ディスプレイ広告枠のあるサイトの中から、掲載先を指定して配信する手法です。特定のサイトにのみ配信ができるので、効果が高いと思われる関連性の高いサイトを選ぶ事が重要となります。

サイトカテゴリ(トピック)ターゲティング

カテゴリを指定して広告配信する手法です。たとえば広告主がカテゴリを「旅行」「地域」に設定すると、そのカテゴリに属するサイトにのみ広告を掲載することができます。Google AdWords ではトピックターゲティングと呼びます。

プレミアム広告(純広告)数多あるメディアの中から自社の商品やサービスのターゲットが多く閲覧しているであろうメディアを抽出し、一定期間、定められた料金を支払い広告掲載をすることを指します。大手ポータルや新聞社サイト等は圧倒的に閲覧者数が多いだけでなく、社会的信用力も高いため商品やサービスの認知促進に効果的です。表現力豊かなクリエイティブ配信も可能であるため、ビジュアルインパクトを重視する商品やサービスの場合にとくに効力を発揮します。

※リスティング以外はバナー・テキストどちらも出稿できます。

DSP(Demand-Side Platform)オンライン広告において、広告主(購入者)側の広告効果の最大化を支援するツールのことです。広告主側が行う予算管理、入稿管理、掲載面の管理、予算やターゲットとするユーザー属性などに基づいた最適な広告枠の選定、あるいは、過去の成果を反映することで行われる配信条件の最適化、といった機能を提供します。代表的なサービスに MicroAdBRADE があり、巨大なネットワークを活かして効率的な広告配信が可能です。また、たとえば通販に限る場合なら楽天DSP なども有力です。

インタレストカテゴリターゲティング

ユーザーの行動記録から興味・関心を判別して、それにマッチする広告を配信します。たとえばコスメに関するサイトを頻繁に見ているユーザーには「化粧」「美容」に関連した広告が配信される仕組みです。

インターネット広告 出稿代理①

リスティングは「キーワード入札価格×クリック数」のみ、他は「インプレッション単価」「コンバージョン単価」からも選べます。課金方式

掲載期間とスペースで固定額が課金される期間保証型、料金に応じたページビュー数を達成するまで掲載されるページビュー保証型があります。課金方式 インプレッション 1,000 回あたりの料金(CPM)のほか、リスティングと

同じクリック保証型や広告表示時間単位での課金方式(GTS)があります。課金方式

Page 12: Portfolio - 大阪市西区 Wild Cards ワイルドカーズwild-cards.net/portfolio.pdf · 2017-05-26 · サイトの機能性・拡張性を重視のため、基本的にCMS(WordPress)を利用して制作しています。

Youtube 内の動画再生前や検索結果一覧などで動画広告を掲載できます。CPV(視聴課金型)の広告のためユーザーが動画を視聴しない限りは請求は発生しません。放映時間が固定されている TV の CM とは異なり、「好きな時に動画を見る」という現在のライフスタイルにも合致しているため、より効果を発揮します。

アルファブロガー(影響力のあるブログの書き手)に依頼し、あたかも自主的な投稿のように商品やサービスを紹介してもらう広告手法。とくにアメーバブログでの芸能人・有名人とのタイアップ広告は抜群の効果が実証されているものの、先般の「ペニーオークション」問題のように運用法を間違うと炎上に繋がる恐れがあります。

Facebook や Twitter などのソーシャルネットワークを利用してユーザーのタイムライン上に広告配信し、いいね!やフォローによってクチコミや拡散を狙う手法。ユーザーとの直接的な接触は商品やサービスへの親近感を醸成しやすい反面、リテラシーや語彙力が欠如していると些細なことで反感を買い炎上するというリスクがあります。

雑誌でよくあるペイドパブリシティ(記事風広告)と同様、著名なサイトの1ページを割いて記事のような扱いで PR する手法。一見広告には見えないのでじっくりと読んでもらえることが見込めます。とくに最近話題のニュース配信アプリ Gunosy(グノシー)やSmartNews などはスマホ・タブレットからの誘因を期待できます。

自分のサイトで広告収入を得たい法人・個人の運営者が、広告仲介業者が提供するバナー広告を自ら選んでサイトに掲載する方式の広告手法。サイト運営者は収入を増やしたがために積極的にバナークリックするよう訪問者に勧めてくれるというメリットがあります。とくにオタクやニッチを狙うのに適した方法と言えるでしょう。

ここ数年、テレビや紙媒体は横這いですがインターネットは依然伸び続けています。エリアや年齢などでユーザー属性を絞りやすいだけでなく、その行動様式や趣味嗜好まで追跡できるのがネットの強みです。電話やハガキなどではなく画面上でクリックするだけで商品やサービスにアクセスできる簡便さもネットならではと言えます。

とはいえテレビや紙媒体がなくなっていくわけではなく、それら受動のメディアでインプレッションを与えてネットで刈り取るという導線をどう確立していくかが広告効果を左右していくでしょう。

オプトインメールの会員情報を保持している広告会社に依頼し、ターゲットとなる属性(性別・世代・居住エリア・関心事など)に合わせて送信する DM により認知活動を行うことができます。配信先となるユーザーを細かくセグメントてきるため、コツをつかめば高い費用対効果を望めるでしょう。(例:アスクドクターズ

動画広告 ブログ広告 SNS 広告

編集タイアップ広告 アフィリエイト広告 メール広告

インターネット広告 出稿代理②

メディア別広告費の推移これからの広告はメディアミックスが鍵に

Page 13: Portfolio - 大阪市西区 Wild Cards ワイルドカーズwild-cards.net/portfolio.pdf · 2017-05-26 · サイトの機能性・拡張性を重視のため、基本的にCMS(WordPress)を利用して制作しています。

複数の手法を並行して利用し、効果を比較検証。成約率だけでなく導線も考慮して最適な組み合わせを探ります。

インターネット広告ではほとんどの手法で「インプレッション数=広告を表示した回数」「クリック数=広告をクリックした回数」「コンバージョン数=問い合わせや購入に結び付いた数」を具体的な数字で割り出すことができます。

たとえば代表的なインプレッション型のDSP とクリック単価型のリスティングを一定期間併用すれば、どちらがどういった役割を果たし、どんな成果に結び付くかが明らかになります。もっとも低コストで成果が出る組み合わせを探りつつ、別の広告手法も投入していくのがベストです。

動画広告

インターネット広告 出稿代理③

DSP リスティング DSP リスティング DSP リスティング DSP リスティング

①両方のCVRが良好な場合 ②DSPのみ良好な場合 ③リスティングのみ良好な場合 ④両方が低調な場合

どちらも続行 リスティングは中止 そのまま様子見 キーワードや媒体を見直し

広告手法によって異なる役割があり、その効果はコンバージョンだけでは測れません。

もっとも分かりやすい指標が、最終的な目標地点であるコンバージョンレートです。ただし、広告手法によってはコンバージョンよりもインプレッションに目覚ましい効

果を発揮するものもありますし、異なる手法を併用することによって相乗効果や波及効果が現れることもあります。

たとえば上記③の例では、DSPでのコンバージョンが低くてもインプレッションにより広告の露出機会が増大し、結果リスティングでのCVR増に結び付いた可能性があり

ます。とくにビジュアルが重視される商材やサービスにおいては、テキストだけよりも画像でインパクトを与えることがその後のアクションに繋がりやすいと言えます。

ですので、広告そのものに掛かる費用以上に、どんな広告手法や媒体先、イメージが適しているかを常に模索しつつブラッシュアップするためのコストを計算に入れてお

くべきです。

Page 14: Portfolio - 大阪市西区 Wild Cards ワイルドカーズwild-cards.net/portfolio.pdf · 2017-05-26 · サイトの機能性・拡張性を重視のため、基本的にCMS(WordPress)を利用して制作しています。

企画書作成(例)Webサイト制作の前段階として企画書や仕様書、要件定義等も必要に応じて作成します。

①ターゲット・セグメンテーション

②アイデアフラッシュ

③キーワード選定

④コンテンツフロー

⑤ワイヤーフレーム

サイトの出来不出来は9割がた基礎設計の段階で決まっていますWebサイト制作において、デザインの美醜は二の次と言っても過言ではありません。いかに閲覧ユーザーが目的の情報に最短で辿り着けるか、ナビゲータブルな設計こそが肝要です。そのために何をすべきかをクライアント様と認識を共有するためのツールとして企画書が存在します。

商品やサービスの訴求対象を属性やニーズレベルで切り分け・絞り込みを行うことで、より効率的で費用対効果の高いコンテンツの企画制作が可能になります。

SEO対策のためのキーワードをコンテンツページ毎に選定し、それをもとに文章内のキーワードバランスを調整できるよう準備します。

とくにロングテールSEOの場合などは、これをサイト設計のある程度早い段階で行っておかないと特定の層のユーザーを取りこぼすことになります。

②③をもとに実施が決定したコンテンツを、最後尾の階層までフローに落とし込みます。

サイト制作前に全体像とコンテンツ毎の相関性等を把握すると同時に、閲覧ユーザーが目的の情報に辿り着くまでの導線を明確にします。

TOPページおよび各コンテンツページの骨格をラフ(粗書き)レベルで図案化します。

デザインを起こす前に要素と配置を決めておかないと、制作が進んだ段階で不要な修正や差し替えが頻発することになります。

想像し得るあらゆるユーザーの立場で「あったら嬉しい」コンテンツを洗い出します。

実現の可不可や優先順位でそれらを篩にかけ、最終候補となったコンテンツ案を予め設定したゴールやマイルストーンに沿って実施時期を決定します。

サンプル:『自然治癒力学校』

Webサイトリニューアル案