小学生も大興奮！「デザインってこんなに面白い！」
私達の身の回りのものにはすべて「デザイン」の要素が含まれている。しかし、普段の生活で、それを意識することはほとんどない。 そんなデザインのことを知る貴重なワークショップが、「AMDキッズ プログラミング・キャンプ」の3日目に開催された。 「AMDキッズ プログラミング・キャンプ」は、CPUでおなじみのAMDが、GIGAスクール時代の教育分野への貢献プロジェクトとして行っている「AMDキッズキャンペーン」のひとつ。2020年から始まったこのプロジェクトでは、日本全国の子どもたちに、ワークショップなどを通じてコンピュータの楽しさを知ること、テクノロジーとともに活用できるスキルを身に付けることを目的としている。 「AMDキッズキャンペーン」では毎回、全国からメンバーを公募し、抽選でメンバーに選ばれた子どもたちには、AMDのCPUが搭載された最新のノートPCがプレゼントされる。第3弾となる今回は、
Webサイト制作の第一歩は目的とゴールの設定から
ひとくちに「Webサイト」といっても、さまざまな種類があります。大きく分けると、商品を広く告知するための「プロモーションサイト」、企業の情報を伝える「コーポレートサイト」、インターネットを通じて商品を販売する「ECサイト」があり、ほかにもオンライン上でサービスを提供する「サービスサイト」、ニュースなどのコンテンツを発信する「情報サイト」などが挙げられます。 さまざまなタイプのWebサイトがあるのは、Webサイトには必ず目的があり、発注するクライアントによって目指すゴールが違うからです。たとえば、特定の商品のプロモーションサイトであれば、商品の存在を多くの人に知ってもらうのがサイトの目的であり、最終的に購入してもらうことがゴールになります。 Webディレクターには、Webサイトの目的を的確にとらえ、クライアントが目指すゴールまでの道筋を引いてプロジェクトを進行していく役割が求められます。 ま
意外と知らない、失敗しないインタビューの「質問のコツ」と「事前準備」
インタビューの仕方を知っていますか？ 準備不足でインタビューに臨んでしまうと、うまく会話が進まなかったり、内容の薄い記事になってしまったりすることがあります。事前に準備するポイントと、質問のコツを紹介します。 近年、企業は顧客の課題の解決方法として商品紹介のみならず、さまざまな情報をコンテンツとして発信しています。数多くあるコンテンツのひとつに、インタビュー記事があります。 今回は、インタビューを実施する前に行うべき事前準備について解説します。 インタビューの心構え 自社のメディア（サイト）を運用していれば、一度は検討したことがあるかもしれないインタビューコンテンツ。いざ実施してみると「一問一答になってしまう」「当日に盛り上がったのはいいものの、後日になって記事を読むと内容が薄い」といった悩みや不満を持ったという方もいるかもしれません。 こうした悩みや不満は、インタビューする側だけでなく、
たった2時間でWebサイトのUXを劇的に改善する5つのテクニック
UXを大げさに捉えていませんか？ ちょっとした工夫でユーザーの負担を軽減し、気持ちよく操作できるようにする5つのテクニックを紹介します。 Webサイトを作り終えたら、できるだけ早く公開したいものです。しかし、すぐに公開することの犠牲もあります。重大なUX要素を見逃し、ユーザーにとって使いにくいWebサイトができ上がってしまうのです。 問題は、公開前に「近道」をすると、1時間かそこらで解決できたであろうUXのミスのために、長期的にWebサイトを使い続けてくれるユーザーを永遠に失ってしまうことです。この記事ではすばやくUXを改善する簡単な技を紹介します。 1. ユーザーに計算させないこと ■シナリオ：「この投稿は新しいものか？」 いま読んでいる記事が今日、昨日、または先週公開されたものなのか調べようとした経験は誰にでもあると思います。そして公開日を探そうとWebページをくまなく探し回り、ようや
SketchとAdobe XDを使っていたデザイナーの私がFigmaに心底惚れたワケ
SitePointのデザイナーであり、デザイン＆UX分野の編集者でもあるAlexが振り返る、2016年のデザインツール事情。たくさんのツールが登場した中でもFigmaは特にお気に入りのようです。 2016年ももう終わりですので（日本版編注：この記事のオリジナルは昨年12月に執筆された）、この1年でワークフローがどう変わったかを振り返るのはおもしろいと思います。この1年で多くのツールや手法が大きく変わったのは驚くべきことです。 個人的には、2016年のデザインおよびUXで注目のテーマは、Chromeアプリが本格的なWebデザインツールの候補になったことだと思います。実際に、2016年はこれに関する記事を3本執筆しました。 振り返ると、4月にはJarek Foksaの優れたツールでありSVGエディタのBoxySVGについて執筆しました（『シンプル・爆速・超便利な無料SVGエディター「Boxy
もう使ってる？ GoogleデータスタジオでGAのレポートを超カッコよくデザイン
昨年9月に日本でも使えるようになった「Google データスタジオ」。本格的な分析には物足りないものの、Google アナリティクスのレポートをもっと見栄えよくビジュアライズしてクライアントに見せるには便利なツールです。 デジタルマーケティング担当者なら、マーケティングの成果を評価するために膨大なデータを分析する必要があり、しばしば途方にくれることがあると思います。トラフィック、コンバージョン率、ユーザーのロケーション、行動、獲得数など、少し例を挙げただけでもこれだけあり、デジタルマーケティング活動の進展を明確にするにはこれらすべてを調査する必要があります。 クライアントへの報告はプロジェクトを引き受ける場合にデジタルマーケティング担当者が直面するもっとも大きな課題の1つです。インターネットの専門家から見れば、数字や統計値の羅列は意味のあるものですが、一般のカスタマーはそこまで技術に精通し
サイトの課題はユーザーインタビューで知る (1/2)
「ユーザーインタビュー」。聞いたことはあっても実施するタイミング、方法、結果の活用方法がわからない方も多いのでは？ ヤフーでUXデザイナーを務める瀧知惠美氏が、事例をもとに4回にわたって解説します。（編集部） ユーザーインタビュー（直接ユーザーと話をすること）を業務で活用する場合、わからないこと、うまくいかないことが多々あります。本連載では、ユーザーインタビューを実践するにあたって気をつけるべき細かなポイントを、実施プロセスに沿って紹介します。最初の2回は、Yahoo!ショッピングでユーザーインタビューを活用した事例となります。第1回目の今回は、ユーザーインタビュー実施の意義と準備までまとめました。 そのため、「商品詳細ページでカートボタンが押されにくい」といった課題が見つかると、PDCAを回して商品詳細ページを改善していましたが、大きな効果は得られませんでした。そこで、ユーザー導線を俯瞰
ここまでできる！Instagramマーケ活用6つのアイデア
Instagramの企業活用をテーマに、アカウントの解説方法から運用のコツ、キャンペーンや広告出稿の方法を解説する「今日からできる！実践Instagramマーケティング入門」。最終回は、国内外の先進企業が取り組む、Instagramのユニークな活用法を6つ紹介します。より本格的なマーケティング活用のヒントにしてください。 1.投稿をコンバージョンへつなげる ため息が出るような美しい観光地の写真を見て、「一度は行ってみたい」と思ったことは誰しもあるでしょう。とはいえ、思い立ってから旅へ出るための手間を考えると、どうしても尻込みしてしまいますよね。 そこでコンラッドホテルが始めたのが、ホテルのInstagramアカウントからホテルの専用ページにリンクし、宿泊予約ができるというサービス。 コンラッドホテルのInstagramアカウントでは、世界各国に展開するホテルとその周辺観光地の写真を投稿して
Googleアナリティクスを無償で使いやすくする「Dot metrix」
オプトインキュベートとイロドリは2月5日、無料で使えるKPI自動レコメンド型サイト分析ツール「Dot metrix」にて、Googleアナリティクスと連携したアクセス解析サービスを提供開始した。併せて、日々の分析指標のサマリーをメールにて通知する「デイリーレポートメールサービス」も無償提供する。 Googleアナリティクスを分析に利用する企業は多いが、分析可能な指標が豊富な一方、見たい指標を確認するために複数の操作やツール利用の知識が必要となり、分析に時間がかかる。そこでDot metrixとGoogleアナリティクスを連携させ、必要な分析指標だけを面倒な操作なく一画面で見られるようにする。 Dot metrixは、サイト分析が実施できていないスタートアップ・ベンチャー、中小企業向けに開発されたサービス。「無料で利用可能」「簡単に導入可能」「シンプルで使いやすい」「サービスに合ったKPIを
これならライバルに勝てる！Facebookバナーの作り方
「インストールされない」「使われない」「儲からない」ーー100本超のアプリ運用実績を持つ「エキサイト株式会社」の事例から、アプリを失敗で終わらせないためのノウハウを学ぶ書籍『事例に学ぶスマホアプリマーケティングの鉄則87 企画からプロモーション、分析、マネタイズまで』。本書の中から、現場ですぐに使える「鉄則」を厳選して紹介します。 Facebookにはさまざまなアプリの広告が表示されます。競合他社の広告を参考にして、より効果的なクリエイティブバナーを作成しましょう。 効果的な広告クリエイティブを作成する方法 Facebook広告のクリエイティブバナーは、1200×628ピクセルが推奨されており、「画像の中のテキストはクリエイティブの20％を超えてはいけない」などのルールがあります。ルールを無視してクリエイティブを作っても配信できませんので、作成前にガイドラインを必ず確認しておきましょう。
高い、遅い、管理が大変？ 常時SSLにまつわる誤解を解く
Webサイト全体をSSL化することで、高いセキュリティを実現する「常時SSL」への移行が本格化しつつある。SSLサーバー証明書で高い実績を誇るシマンテックに「常時SSLは高コスト」「通信は遅くなる」「管理が大変になる」といった常時SSLにまつわる懸念について聞いてみた。 Webサイトの信頼性を高める常時SSLとは？ 常時SSLとは、文字通りWebサイト全体にSSL※を実装すること。1990年代のインターネット黎明期から、Webサイトのセキュリティを守ってきたSSLを用いて、Webサイト自体の安全性をユーザーに保証すると共に、通信を暗号化し、データの漏えいを防ぐ。以前は問い合わせやショッピングカードのフォームのみSSLをかけることが多かったが、これをサイト全体に拡大するのが常時SSLだ。 ※通信の暗号化技術の名称として「SSL」が広く普及しているため、本稿では「TLS」を指していてもSSLと
6限目：「サッカー監督目線」で組み立てるLPの情報配置
ランディングページとWebコピーライティング さてさて、今回の授業は「ランディングページ」を題材に、Webページ全体の情報配置……つまりはレイアウトについて解説していきたいと思います。 「いや、センセイ、この連載ってWebのコピーに関する授業でしょ？」と思った方、あるいは舌打ちをしたり疑いの目を向けたりした方も多いと思いますが、先生は決して怒りません。正直に手を挙げてください。あ、けっこういるな（チッ）。まあ、そう決めつけずに、まずはいつも通りもうちょっと僕の話を聞いてください。 Webでコピーを書く場合、「そのコピーがどこに置かれるか？」ということは、けっこう重要な問題です。あるいは、「コピー以外の画像や図表などがどのように配置されるか？」によっても、コピーの果たす役割や性格は大きく変わってきます。 「ランディングページ」といえば、ものすごくざっくり言えば、チラシのWeb版のような存在。
5限目：「情報」を「コンテンツ」に変える 告知コピー制作メソッド
「情報」と「コンテンツ」の違い 長らくご無沙汰しております。Rockaku森田です。連載開始前、当時の編集担当者さんと「隔週で」とお約束したのに、いつの間にか隔月も危うい感じになっていますが……ええと、こういう場合、なんて言えば印象良くなるんだっけ……あ、そうだ、「満を持して」ですね。ええ。満を持して、5限目の授業をはじめたいと思いますっ。 今回のテーマは「告知ページ」のコピーライティング。略して「告知コピー」です。お、かなり実践的な内容になりそうな予感ですね。大丈夫です。たぶんそうなります。 最近、僕は講義や打ち合わせの現場でよく、「情報とコンテンツは別物である」という話をしています。「情報」と「コンテンツ」。この2つの違いって何だと思いますか？ これも例によって、答えは無数にあると思いますが、僕は「プレゼントになっているかどうか？」だと思っています。はい、そこ、きょとんとしない！ もう
Gmailを確実に便利にする10の方法 (3/3)
フィルター機能を使いこなす 階層構造の整理、不要なメールの削除、転送などが便利なフィルター機能。送信元のアドレスを指定し、同僚/友人/Twitterからの通知/メルマガなどでラベルを付けるようにしておくと便利だ。キーとなるのは「受信トレイをスキップ」してラベル付けする機能。本当に必要なメールだけ受信トレイに残すことで、メール処理の労力を節約できる。 余裕があれば迷惑メールが来ないと分かっているアドレスからのメールは保護するよう設定しておくといい。Gmailのスパムフィルターに定評はあるが、誤認識はゼロではないからだ。おすすめのフィルター用キーワードは以下のとおり。 【 has:attachment 】 添付ファイル付きのメールを指定する 【 filename:XXX 】 添付ファイルの種類（拡張子）を指定する 【 -from:{ XXX@XXX.com, XXX@XXX.com} 】 複数
CVRが驚くほど上がるボタンデザイン7つの法則
Webサイトやアプリを訪れたユーザーに対して、ゴールまでの最適な道筋をつけるのがCTA（Call to Action：行動喚起）。このCTAを意識してボタンをデザインすることで、クリック率やコンバージョン率を大幅に改善できます。ボタンを実装するときにチェックしておきたい7つの法則を紹介します。 1.ユーザーの言葉を使う ネットで買い物しているところを想像してみましょう。以下の2つのボタンがあったら、どちらを押したくなるでしょうか。 ほとんどの方は、右の「注文する」を選んだはずです。デザインがまったく同じボタンがあったとしたら、自分が日ごろから使っている言葉のほうがピンときて押しやすい。企業側の言い回しと、ユーザー側の言い回しがずれているほど、ユーザーはアクションを起こしづらくなります。ボタンのラベルにはユーザーが普段使っている言葉を使いましょう。 Webサイトの制作ではつい企業目線の言葉を
書かなきゃいけない人のためのWebコピーライティング教室
「書くのが得意ではないけれど、仕事で書かなければならない」。そんなWeb担当者のために、コピーライティングの考え方と実践的な書き方を、現役コピーライターの森田哲生さんが解説。Webでの商品売上げを伸ばしたい、Webコンテンツの読者を増やしたい、Webで会社のブランドイメージを高めたい人、必読です。
SEO対策のためのWebライティング実践講座
Webコンテンツで重要なのは見出しだ。ニュースサイトでもグーグルでもTwitterでも、ユーザーは数十字のテキストで読む価値があるか判断している。コンテンツが魅力的でも見出しが響かなければ届かない。 2012年に刊行した書籍『Webライティング実践講座』では、見出しを以下の3つに分類した。 SEO見出し 検索エンジンに「受ける」ことを狙った見出し。検索の動機になった情報需要に対して、的確な見出しを付けたコンテンツを供給する。検索ボリュームと検索順位に応じた流入が継続的に期待できる。ちなみに、検索ボリュームが大きいが、競合の少ないキーワードの組み合わせは、リスティング広告よりもメディアの領域である。SEO見出しで継続的な集客を期待できる。 煽り見出し ソーシャルメディアで「目立つ」ことを狙う見出し。常識を覆す見出しを供給することで情報への需要を作り出す（炎上マーケティング）。ソーシャルメディ
無料でできる！ ゲームアプリ集客6つの施策
毎日毎日新しいアプリが世の中にリリースされていますが、その中で埋もれてしまわないように、常に新規ユーザーの集客施策は欠かせません。ただし、かけられるコストも有限なため、すべての施策が思うように実施できるわけではありません。 そこで今回は、無料で実施できる集客方法＠ゲーム編として、無料でできる手法をまとめました。 1.無料で利用できる事前登録サービス 「事前登録：予約トップ10」には、リリース前のアプリの情報を事前に公開できるサービスがあります。 今年6月に一部の機能を除き無料化されました。以前の記事でも書きましたが、事前登録してくれるユーザーは、継続して遊んでくれる熱量の高いユーザーが多いので、実施することをオススメします。 ただし、事前公開サービスに掲載するだけではなく、プレスリリースやメディア掲載もあわせることで、事前登録自体の認知を上げ、ユーザーの予約者数を増やした方がよいと思います
あのサイトとはひと味違う！こだわりマウスオーバー20連発 (1/2)
サイトを彩る多彩なアニメーション フラットデザインをベースに、随所に気持ちいいアニメーションを取り入れている「Omnisense」。コンテンツごとに用意されているさまざまなアニメーションは、どれも洗練された動きで、サイトの魅力をぐっと高めている。 ページトップにあるシンプルなボタンにマウスオーバーすると、上から矢印のアイコンがスライドして下りてくる。注目したいのは、マウスがボタンから離れたとき（マウスアウト時）の動きだ。 よくある:hoverで実装したマウスオーバーのアニメーションは、マウスオーバー時とアウト時の動きを別々に設定できないため、必ず逆の動きになる。マウスオーバー時に上からスライドしてきたら、マウスアウト時には上へ戻る、といった具合だ。 ところが、Omisenseのボタンは、マウスアウト時にそのまま下にスライドを続ける。細かな違いだが、最近ではこういったマウスオーバーのアニメー
オリエンテーションとヒアリング
Webサイト制作におけるオリエンテーションとは、クライアントもしくはクライアントから依頼を受けた発注者と、Webサイト制作を円滑に進めるために実際に会って打ち合わせをすることです。ヒアリングでは、オリエンテーションの参加者から、どのようなWebサイトにしたいかというニーズを的確にくみ取ります。 オリエンテーションとヒアリングの両方で重要になるのがアジェンダです。アジェンダは「予定表」や「行動計画」という意味ですが、ここではオリエンテーションやヒアリングでの打ち合わせ用の議題を指します。 オリエンテーション／ヒアリングを実施するには オリエンテーションやヒアリングの前には、クライアントや発注担当者にメールなどでアジェンダを連絡しておきましょう。アジェンダには、開催日時、場所、確認したい内容を箇条書きで記載します。 事前にアジェンダを渡しておけば、参加者は打ち合わせの準備ができます。また、打ち
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
