インプレス ビジネスメディア

CSS Nite公式サイト

LP66「デザイントレンド」感想戦（フォローアップ公開記念）

CSS Nite公式サイト
5 years 4ヶ月 ago

2020年1月に開催されたLP66「デザイントレンド」のフォローアップ公開を記念して、出演者が集合し、動画（の一部）を見ながらワイヤイやるライブ番組を配信します。

  • 日時：2020/07/15(水) 21:30-23:00
  • 参加費：無料
  • 出演：原　一浩（カンソクインダストリーズ） 、矢野 りん（バイドゥ）、坂本 邦夫（フォルトゥナ）、清家 順（ユニバーサルワークス）
  • お申し込み：Doorkeeper
  • 備考：お申し込みされなくても参加可能です。

Zoomウェビナー、Facebook Live、YouTube Liveにて同時配信します。

CSS Nite実行委員会

CSS Nite LP66 「デザイントレンド特別版」フォローアップ（2）Webデザイントレンド［特別版］

CSS Nite公式サイト
5 years 4ヶ月 ago

2020年1月18日にAbemaTowers 10階セミナールームで開催したCSS Nite LP66 「デザイントレンド特別版」のフォローアップとして、原　一浩さん（カンソクインダストリーズ）、矢野 りんさん（バイドゥ）、坂本 邦夫さん（フォルトゥナ）の『Webデザイントレンド［特別版］』セッションのスライドなどを公開します。

動画

動画は7月15日23:00に公開開始。

フォローアップ

原 一浩さんから

Webデザイントレンド[特別編]と、Webデザイントレンド[自治体編]を担当しましたカンソクインダストリーズの原です。
雨が降る中、ご参加いただきまして誠にありがとうございます。

年末行った Shift13 のWebデザイントレンドセッションより2倍以上の時間をいただいてお話しましたが、年末話せなかったネタも含めまして、なおかつ初めて参加した方にもわかりやすくなるよう再構成しました。
ちょっと時間がおしてしまった点はお詫び申し上げます。

さて、まずは自治体編の冒頭で触れました前回のWebデザイントレンド自治体編についてフォローアップページのご案内をしておきます。
前回は 2016年2月24日にワテラス コモンホール（お茶の水）で開催され、当時は自治体サイトだけでなく自治体特設サイトについても触れました。

  • CSS Nite LP44「Webデザイントレンド（自治体編）＋自治体サイトアクセシビリティ診断」フォローアップ | CSS Nite公式サイト http://cssnite.jp/archives/post_2866.html

フォローアップサイトにある写真が少しコスプレ気味になっている点はご容赦ください。当時のスライドを見ていただきますと、時代の変化を感じとることができると思います。例えば、坂戸市のWebサイト (https://www.city.sakado.lg.jp/) は当時自治体Webサイトとしては斬新だと紹介していますが昨年リニューアルされました。どう変わったのか、ご自身の目で是非確かめてみてください。

世界の大学編は、年末はじめて行ったリサーチでしたが概ね好評な評価をいただき誠にありがとうございます。懇親会の場では大学の現場にいらした方より、より詳しいお話を伺うことができました。Webデザイントレンドセッションは発生している現象を表面から深掘りしていくスタイルなため、なかなか中の状況までたどり着くことはありません。ただ、参加者の中には自分が担当していたサイトが取り上げられましたという人もたびたびいて、その方からより深い話を聞くことができたりします。もし可能なら懇親会まで含めてのご参加を検討いただけるとより満足できる内容になるかと思います。

続いて、世界の大学編でスライドに掲載していなかったVRについて紹介します。VRといってもいわゆるヘッドマウントディプレイをつけて何かするという形ではなく、あくまで擬似的に大学内を散策するようなコンテンツということでのVRとなります。
以下の大学のWebサイトのフッター付近には、パノラマ写真が回転しているエリアがあります。ここがYouVisitというサービスを使っている箇所で、クリックするとユーザー登録が必要となりますがキャンパスの紹介を見ることができます。

また、アクセシビリティツールについても補足情報を書きます。
セッション中に紹介したUSERWAYが使われているサイトは以下のようなサイトですが (こちらは左上にアクセシビリツールが配置されています)、

他にもツールがあるので紹介しておきます。以下のサイトではAudioEyeというツールが使われていて、右下にあるアクセシビリティアイコンをクリックすることで起動しますが、まるでデスクトップアプリケーションのようなツールパネルが起動します。

こちらも合わせてチェックしてみてください。
今回の配布資料ですが、インターネット上での再配布はご遠慮いただいておりますが、社内にて発信元を明記の上でしたら自由にご利用いただいても構いません。お仕事やプレゼンのネタとしてご利用くださいませ。また、社内セミナーなどを実施したいなどのご要望がありましたが、お気軽にお声がけください。

最後に、今後のWebデザイントレンドの開催予定について書いておきます。

次に開催される場所は青森で、2月15日になります。イベント詳細については以下のリンクを参照ください。

続いて次の開催地は大阪で、3月1日に開催されます。

もし、開催地近くに在住のご友人などがおられましたら教えていただけるとありがたいです。

ではでは、良いWebデザインライフを！

Kansock.Industries 原 一浩
https://kansock.industries/
Twitter : https://twitter.com/karad
Facebook : https://www.facebook.com/kazuhirohara

矢野さんから

CSS Nite LP66 Webデザイントレンドセッションにご参加ありがとうございました。
矢野からはフォローアップとしてグローバルの若年層で高い支持を得ているサービス増量版、およびセッション内で口頭で触れた動画サービスの紹介と、ランキング選外だけど知ってほしいWebサイトをご紹介します。

新しいサービス

Soul

https://www.soulapp.cn/

上海生まれの「リアルで会わない出会い系」。ソウルメイトと引き合わせてくれるという壮大な用途をかかげています。

Discord

https://discordapp.com/

各ユーザにサーバを割り当て、そのサーバに友達を勧誘するという斬新な基本設計の音声チャットサービス。誰かが立てたサーバで遊ぶという前提はマインクラフトのおかげで最近の若年層にとってはなじみがあるようです。
若年層はDiscordでボイスチャットすることを「ディスコでボイチャする」などと言います。

Zenly（ゼンリー）

https://zen.ly/home

リアルな友達同士の交流ツールです。『友達同士で一番よく送られているメッセージって「いまどこ？」なんだって。Zenlyを使えば、もうそんなメッセージ送る必要ないよ！
という紹介文の高校生に絶大な支持を得る位置共有アプリ。

Amino

https://aminoapps.com/
もとは韓国アイドルとアニメの話題で盛り上がるためのWebコミュニティでしたが、近年スマホUIに特化しました。上海生まれNY育ち。

Yey

https://yay.space/
高校生をメインターゲットとしたコミュニティサービスです。サービス自も興味深いですが、運営の拠点を自社ドメインではなくnote上に置いている点も面白いですね。
https://note.com/yayofficial
SEOを自社でがんばるより有効なのかもしれません。

動画サービス

Wistia

https://wistia.com/

Bryan university
https://bryanuniversity.edu/
が導入している動画配信サービス。
自社のブランドに合わせて動画のUIデザインを調整できるツールや配信技術を提供しています。コンテンツ・マーケティングの考え方に関する読み物もあります。

Britecove

https://www.brightcove.com/ja/solutions/marketers

HSBC
https://www.hsbc.com/
が導入している動画サービス。
こちらは部分的に日本語にローカライズされています。動画配信技術やマーケティングのためのデータ分析ダッシュボードなどを提供しています。

ぜひ見ていただきたい選外のサイト

Alban Mezino氏の自己紹介

https://albanmezino.fr/

フリーランスのデベロッパーの自己紹介です。
かなり砕けた内容ですが、自分の立ち位置や価値観を素直に強く表明している点が印象的です。

tobaccodock イベント紹介サイト

https://www.tobaccodocklondon.com/

問い合わせへのリンク先を常にfooterにFIXさせているところなど、デザインセオリーにとらわれずにイベントの想定参加者の課題をよく見ているところが素晴らしいです。

メールクライアントアプリの紹介ページ

https://www.juicymail.co/

昨年なら静止画像でもそれなりに製品説明サイトの体裁はつくろえましたが、デモを動画で見せなければ全く伝わらない時代になりました。svgでフレームを作り、中にvimeoにアップした動画をはめ込んでモーショングラフィックっぽく見せているところも良い演出。

以上、セオリーにとらわれずにどこまで工夫ができるのか。まさに「独自の工夫」こそ次のトレンドであると言えそうです。

CSS Nite実行委員会

CSS Nite LP66 「デザイントレンド特別版」フォローアップ（1）VODにおける UIデザインとトレンド

CSS Nite公式サイト
5 years 4ヶ月 ago

2020年1月18日にAbemaTowers 10階セミナールームで開催したCSS Nite LP66 「デザイントレンド特別版」のフォローアップとして、松本 俊介（サイバーエージェント）さん、内田 達也さん（サイバーエージェント）の『VODにおける UIデザインとトレンド』セッションのスライドなどを公開します。

動画

リンク先

CSS Nite実行委員会

CSS Nite LP66 「デザイントレンド特別版」フォローアップ（3）Webデザイントレンド ［自治体編］

CSS Nite公式サイト
5 years 4ヶ月 ago

2020年1月18日にAbemaTowers 10階セミナールームで開催したCSS Nite LP66 「デザイントレンド特別版」のフォローアップとして、原　一浩さん（カンソクインダストリーズ）、坂本 邦夫さん（フォルトゥナ）、清家 順さん（ユニバーサルワークス）の『Webデザイントレンド ［自治体編］』セッションのスライドなどを公開します。

動画

動画は7月15日23:00に公開開始。

フォローアップ

清家さんから

Webデザイントレンド[自治体編]を担当しましたユニバーサルワークスの清家です。私自身は、約4年ぶりのCSS nite出演となりましたが、ご満足いただけましたでしょうか。

今回は、リニューアルされたサイトを対象としたランキングに加え、「清家の目」では「シティプロモーションという名の憧憬」をテーマにお話しました。ランキングと清家の目、どちらも自治体の思いや特徴が表現されているかどうかを重視し、それぞれの自治体が持つ魅力、自治体サイトが持つ楽しさをお伝えしようと目論みました。

清家の目では、シティプロモーションサイト、特に移住・定住をテーマにしたコンテンツのコピーやメッセージに注目し、その取組を比較しました。「都会」と「田舎」というあいまいな尺度の中で、両方の要素をバランスよく併せ持つことができている自治体、都市機能の充実を謳う自治体、豊かな自然と穏やかな暮らしを訴求する自治体など、様々です。そのまちならではの魅力をWebサイトで表現すべく工夫（苦悩？）している様子を感じ取っていただけたら幸いです。

今回のセッションでは、十分なコメントはできませんでしたが、自治体サイトは、Webアクセシビリティ確保の観点からも優れた事例や興味深い取組やたくさんあります。当社ユニバーサルワークスが毎年実施している「自治体サイトWebアクセシビリティ調査」で、その一端を垣間見ることができると思いますのでぜひご一読ください。

  • 自治体サイトWebアクセシビリティ調査 2019 - 有限会社ユニバーサルワークス「404エラーページにも光を」 https://www.u-works.co.jp/jichitai/

最後に。
アンケートへの回答ありがとうございました。参加いただいた方の地元や周辺自治体が取り上げられたケースがあったようで、ご自身が持つイメージとWebサイトで表現されているイメージの差に言及いただくなど、とても参考になりました。住民が認知している強みと、外から見たイメージにギャップがある場合、それを解消するのか、より強調するのかでコンテンツやデザインが変わってくるはずです。そんなことにも注意を払いながら自治体サイトウォッチを続けたいと思います。

有限会社ユニバーサルワークス　清家 順
https://www.u-works.co.jp/

坂本さんから

Webデザイントレンド［特別版］・ Webデザイントレンド[自治体編]を担当したフォルトゥナの坂本です。足下の悪い中、ご参加いただきありがとうございました。年末のShiftは2年間お休みさせていただいており、久々に東京でお話させていただきましたが、ご満足いただけたならうれしく思います。坂本からはサイトで取り入れられていたツールについて少し補足したいと思います。

以前はアクセシビリティ・お問い合わせなどは自前で実装していたことが多かったのですが、最近は外部のツールを上手く取り入れて、組み合わせるようになってきています。その代表的なものがチャットボット・アクセシビリティツールです。

チャットボット

まずチャットボットですが、国内外様々なサービスがあります。数年前は海外のサービスを日本語で使うという選択肢も多かったのですが、国産のサービスも増えました。かなりの種類があるため、どれを選ぶかというのは製作者（提案者）の腕の見せ所と言えるかもしれません。

自治体や大学サイトなどでは質問と回答がある程度想定できることから、機械学習で回答の精度を上げていけるはずで、そのノウハウは予算規模の大きなサイトだけでなく、小規模のものにも活かされていくはずです。

このような話になると、大きなサイトでしか使えないのではないかとなりがちですが、多くの人がチャットボットに使い慣れてくると、もっと小さなサイトでのチャットボットも使われるようになるはずですので、コンタクトの1つの方法として、チャットを上手く使うことを考えてもよいタイミングなのではないかと思います。

アクセシビリティツール

アクセシビリティツールについても、海外を中心に普及してきています。海外では訴訟になるケースも多いため、自前で実装する必要のない部分をツールに任せるというのは妥当な選択肢と言えるでしょう。

今回の調査で見たツールとしては、USERWAYとUser1stの2種類でしたが、
USERWAYはウィジェットを貼り付けるだけで動作しますので、非常に試しやすいのではないかと思います。

私のサイト（ https://www.color-fortuna.com/ ）にも、チャットボットとUSERWAYを取り付けてみましたので、一度お試しください。

年末のShift14にも復活登場することになり、再び原さん・矢野さん・坂本の3人のコンビも復活いたします。このトレンドが年末にはどうなっていくのか、また東京の皆さまとも共有できればうれしく思います。

この度は本当にありがとうございました。

フォルトゥナ 坂本邦夫
https://www.color-fortuna.com/
Twitter : https://twitter.com/Kunio_Sakamoto

CSS Nite実行委員会

CSS Nite Shift13フォローアップ（8）「デザイントレンド」セッション

CSS Nite公式サイト
5 years 5ヶ月 ago

2019年12月21日に浅草橋ヒューリックホールで開催したCSS Nite Shift13「ウェブデザイン行く時代来る時代」のフォローアップとして、原　一浩さん（カンソクインダストリーズ）、矢野 りんさん（バイドゥ）の『Webデザイントレンド』セッションのスライドなどを公開します。

このセッションは、CSS Niteベスト・セッション2019において、ベスト・セッション（次点）に選出されました。

フォローアップ

原のフォローアップ

>CSS Nite Shift13のWebデザイントレンドセッションにご参加ありがとうございました。

今回も昨年と同様、原と矢野それぞれでトレンド要チェックランキングをベスト10まで用意し、それをベスト7にまとめたものを発表しました。昨年はランキング形式はじめてということもあり慣れない部分もあったかと思いますが、改善を進めてバランスのとれたセッションを目指しました。アンケートで寄せられた様々なご意見については、今後のセッションをよりよくしていくために利用したいと思います。

フォローアップとして、ベスト7位以外のランキングについて共有すると共に、アンケートで質問が多かったランキングの産出形式について回答します。年末年始の思索の種としてお使いください。また、スライドについてですが、引用元を明記いただければお仕事の際のプレゼンやリサーチ結果にお使いいただいて構いません（もしうまくいったらこっそり教えてください）。

原のトレンドランキングベスト10

※ 選外のものについては、軽くコメントを付記してあります。

世界のWebデザイン

世界の大学 (アメリカ編)

上場企業サイト

自治体

どういう方法でランキングを作っているの？

つづいて、ランキングの作成方式について。

Webデザイントレンドセッションはサイトのキャプチャやクローリングを行っている原が全体的なサイトチェックをするところから始まります。僕は長年Webサイトのクローラーとキャプチャ、そしてチェックを行うツールを作り続けており、選者となる矢野さん（や、その他のゲストの皆さん）には、そのツールにログインしていろいろなチェックやランキングを実施していただいています。

カテゴリー分け形式からランキング形式に移行してからは以下のような流れでランキングを作っています。作り方はかなりアナログですが、ランキングというフレームワークを使うことで、あまり多くの採用事例はないけど紹介するべきみたいなケースを紹介することができるようになりました。

  1. 原がまず一次チェック。リニューアルしているものしていないものを振り分ける、また海外デザインであればある程度のクオリティに沿って仕分け
  2. 各自、気になった傾向を持っていたり、何かピンときたものなどにチェックをいれる（そういう機能がツールにはあります）
  3. これを何度か繰り返して絞り込みをする。この時点でもまだ全体像はぼんやりとしか見えていないものの、フィルタリングを繰り返したりするごとに多く使われているデザインの傾向が見えてくる
  4. デザインのカテゴリ分けをし、そのカテゴリの中でも特徴が際立ったものを抽出してランキングに加える
  5. ベスト30くらいになってきたら、より細かくサイトをチェックして順位を作っていく
  6. ベスト10まで絞り込んだら各自のランキングは完成
  7. 更に原によってランキングはマージされ、当日の朝打ち合わせをして最終確定

フォローアップは以上となります。

Webデザイントレンドは前年と比べることで今年の変化を感じるタイプのセッションです。もしご都合があえば、来年もまたShiftでお会いできますと幸いです。

矢野のフォローアップ

CSS Nite Shift13のWebデザイントレンドセッションにご参加ありがとうございました。矢野からはフォローアップとしてグローバルの若年層で高い支持を得ているサービスと、選外ながらインパクトの強かったWebサイトをご紹介します。

今年話題だったサービス

Soul

https://www.soulapp.cn/

上海生まれの「リアルで会わない出会い系」。ソウルメイトと引き合わせてくれるという壮大な用途をかかげています。日本では似たコンセプトで「ひま部」というサービスがありましたが、ミスマッチ（援助交際を希望する中年層）などを防止する手段が見出せず2019年12月31日にサービスを終了しました。

Discord

https://discordapp.com/

各ユーザにサーバを割り当て、そのサーバに友達を勧誘するという斬新な基本設計の音声チャットサービス。誰かが立てたサーバで遊ぶという前提はマインクラフトのおかげで最近の若年層にとってはなじみがあるようです。若年層はDiscordでボイスチャットすることを「ディスコでボイチャする」などと言います。

Zenly（ゼンリー）

https://zen.ly/home

リアルな友達同士の交流ツールです。『友達同士で一番よく送られているメッセージって「いまどこ？」なんだって。Zenlyを使えば、もうそんなメッセージ送る必要ないよ！

#bestfriendsonly 』という紹介文の高校生に絶大な支持を得る位置共有アプリ。若い人はMapsを開いてジオコードを共有することすらめんどくさいのですね。コミュニティアプリとは異なりますが今年注目されたサービスです。

ぜひ見ていただきたい選外のサイト

Alban Mezino氏の自己紹介

https://albanmezino.fr/

フリーランスのデベロッパーの自己紹介です。かなり砕けた内容ですが、自分の立ち位置や価値観を素直に強く表明している点が印象的です。

tobaccodock イベント紹介サイト

https://www.tobaccodocklondon.com/

問い合わせへのリンク先を常にfooterにFIXさせているところなど、デザインセオリーにとらわれずにイベントの想定参加者の課題をよく見ているところが素晴らしいです。

メールクライアントアプリの紹介ページ

https://www.juicymail.co/

昨年なら静止画像でもそれなりに製品説明サイトの体裁はつくろえましたが、デモを動画で見せなければ全く伝わらない時代になりました。svgでフレームを作り、中にvimeoにアップした動画をはめ込んでモーショングラフィックっぽく見せているところも良い演出。

以上、セオリーにとらわれずにどこまで工夫ができるのか。まさに「独自の工夫」こそ次のトレンドであると言えそうです。

CSS Nite実行委員会

CSS Nite Shift13フォローアップ（7）「アクセシビリティ」セッション

CSS Nite公式サイト
5 years 8ヶ月 ago

2019年12月21日に浅草橋ヒューリックホールで開催したCSS Nite Shift13「ウェブデザイン行く時代来る時代」のフォローアップとして、植木 真さん（インフォアクシア）、辻 勝利さん（コンセント）の『辻ちゃん・ウエちゃんのAccessiブル GO! GO!「アクセシビリティ ゆく年来る年 2019」の巻』セッションのスライドなどを公開します。

このセッションは、CSS Niteベスト・セッション2019において、ベスト・スピーカーに選出されました。

フォローアップ

メッセージ

辻ちゃん（コンセント　辻 勝利）

先日は、Shift 13にご参加いただきありがとうございました。たくさんの方々に応援していただき、僕たち自身も楽しみながら今年1年のWebアクセシビリティを振り返ることができました。

2020年も、Webに関わる全ての皆さんとアクセシビリティを高めていきたいと思っております。「こんなコンテンツはスクリーン・リーダーでどんな風に読まれるの？」とか、「職場の仲間にも視覚障害者がどんな風にWebを利用しているのか見せたいんだけど。」など、Webアクセシビリティのことなら辻ちゃんウエちゃんに声を掛けてくださいね。

Let's Groove with Accessibility!

ウエちゃん（インフォアクシア　植木 真）

アンケートでは、セッション内容だけでなく、CM動画にもたくさんの賛辞をいただき、嬉しく思っています。今回初めて参加された方は呆気にとられてしまったかもしれませんが（苦笑）

ランキングで断トツのトップだった「画像の代替テキスト」。2019年にもなって、まだ代替テキストなの？と思った方も少なくないでしょう。でも、これが現実なのです。アメリカで提訴されているサイトのほとんどでも、やはり代替テキストの問題を指摘されています。そういう意味では、世界共通の課題だと言えるかもしれません。

今回のShiftでは、各セッションでアクセシビリティに通じるトピックが取り上げられていたのが印象的でした。動画のキャプション（字幕）は、もともとは聴覚障害がある人が動画を楽しむために不可欠なものでしたが、聴覚障害がない人にも利用されています。会場で提供していたUDトークによるリアルタイム字幕も、やはり聴覚障害がある人にも参加いただけるようにすることが目的ですが、ご自分のスマホで聞き逃した部分を遡って字幕を確認できるので、全ての皆さんにとって便利なツールでもあります。

さて、辻ちゃん・ウエちゃんのコンビでお届けする2時間のセミナーが、来年2月7日（金）に都内で開催されます。このフォローアップをご覧の皆さまには、30％OFFの特別割引をご用意しましたので、ぜひご参加ください！

質問への回答（辻ちゃんより）

Q1. スクリーンリーダーで操作されている方はどのくらいいますか？

はっきりとした統計があるわけではありませんが、僕のような全盲の視覚障碍者がPCやスマホを使用する際は、ほとんどの場合スクリーン・リーダーを使用します。ほかにも、画面の内容が読みづらいロービジョンの方の中にも、スクリーン・リーダーを活用している人や画面拡大ソフトと併用している人がいます。

Q2. スクリーンリーダーを使う人のデバイスの割合は、Windowsが多いのでしょうか？

Windows上で動作するスクリーン・リーダーの開発の歴史が長いこともあり、NVDAやPC-Talker、JAWSといったWindows用のスクリーン・リーダーを使用する方が多いと思います。

ただ、近年はスクリーン・リーダー利用者の中にもスマホだけを利用している方もいて、iPhone等のiOS上で動作するVoiceOverを使用している人の数が増えています。VoiceOverはインストール不要で利用できることから、アクセシビリティをチェックする方々にも人気があります。

詳しくは、視覚のアクセシビリティ - iPhone - Apple（日本）のページをご覧ください。

Q3. 擬似要素の:before, :afterでCSS内でテキスト設定した場合、読み上げられるのでしょうか？

スクリーンリーダーの種類によっては読み上げることができますが、そもそもコンテンツはCSSではなくHTMLで提供すべきです。

参考までに、W3Cのドキュメント「F87: 達成基準 1.3.1 の失敗例 － CSS の :before 及び :after 疑似要素並びに 'content' プロパティを用いて、非装飾のコンテンツを挿入している | WCAG 2.0 達成方法集」を参照してください。

Q4. 絵文字はスクリーンリーダーでどういう風に読まれるのでしょうか？

スクリーンリーダーの読み上げ辞書に登録されている絵文字であれば、『

CSS Nite実行委員会

CSS Nite Shift13フォローアップ（6）「フォント」セッション

CSS Nite公式サイト
5 years 9ヶ月 ago

2019年12月21日に浅草橋ヒューリックホールで開催したCSS Nite Shift13「ウェブデザイン行く時代来る時代」のフォローアップとして、関口 浩之さん（SBテクノロジー）、鷹野 雅弘（スイッチ）の『おさえておきたい文字まわりのトレンド 2019』セッションのスライドなどを公開します。

フォローアップ

鷹野から

「フォント」セッションは、文字を中心とした周辺情報を“魚の目”で振り返っています。

私（鷹野）、関口さん（フォントおじさん）、および、良太郎さんの3名でデータベースを作り、そこから、それぞれが、どう読み取るかの考察を作成、すり合わせています。

下記の2点、セッションのネタからは落としましたが、ぜひとも伝えたいことです。

メッセンジャー全盛時代と「助詞」の欠如

コミュニケーションの主戦場がメールからメッセージに移り、より口語的なニュアンスでのやりとりが増えてきました。そこで気になるのが助詞の欠如。

「学校に行きました。」というところ、「学校行きました」のように「に」を略してしまうことです。理解した上で使っていれば問題ありませんが、メッセンジャー以外の文章でも、無意識的に助詞をつけずに書いている人が増えているように見受けられます。

本文の句読点は詰めない

「palt」を使って、すべてを詰めてしまっているサイトが多い印象です。しかし、句読点は“息継ぎ”であり、息継ぎのない文章は読み物には向きません。

「pwid」とうまく使い分けるのがよいでしょう。

リンク集

気になったサービス

ロゴの“耐久テスト”を実行できる

フォントへの関心

たくさんのイベント
組版/タイポグラフィへの関心
テレビ
書籍
一方

今年の漢字「令」

最終画が縦画なのか斜め画なのか？
書き文字と活字との違い

ディスレクシア（識字障害）の子供への「UDデジタル教科書体」の効果

「令和」の画像
AJ1-7
台風
新しい流れ（国際化）
辞書

cf. 映画『舟を編む』

オリンピック

東京オリンピック（2020）
パリオリンピック

ロゴ（リブランド）

映画『JOKER』

How Joker’s gritty logo was created with wood type letterpress - The Verge

コーポレートフォント

IKEA
アリババ

Mercari Sans
アドビ

新書体

永久定番フォントのリニューアル
アップル
iOS13でフォントのインストールを許可
アドビ
手書き風フォントは新たな次元へ
装飾系（デザイン書体）
新しい流れ
  • Kinto（Noto Sansを調整）
  • Universal Sans（自分好みに変えられる）
  • DeepGlyph（深層学習で自動生成）
  • Illustrator for iPad搭載予定のビットマップのフォント化

ウェブまわり

まとめ

上野 学さん（ソシオメディア）

iOS 7 でフラットデザインになった時は単に流行に乗っただけに見えた。でも実はあれはレイアウト、アイコン、フォント&カラーを、レスポンシブ化、ベクター化、セマンティック化する施策のひとつだったんだよね。あれがなければ今の Dark Mode も SF Symbols もない。

フォントおじさんより

鷹野さんとフォントセッションを担当しました「フォントおじさん」こと、SBテクノロジーの関口浩之です。コンビ結成3年目となりました。お楽しみいただけたようでなによりです。ありがとうございました。

身近な存在だけど日頃あまり意識していない書体やフォント。3つのレイヤー（テキスト表現・フォント・タイポグラフィ組版）で意識して考えるといろいろ見えてきます。そして、書体やフォントは、ブランディング観点で、ますます重要になってくると感じた1年でした。コーポレートフォントは今まで、予算の関係で大企業しか検討できませんでしたが、最近、中堅企業や個人商店でも、欧文だけ、数字だけ、ロゴタイプだけというようなカスタマイズ書体の制作ニーズ（そのカスタマイズ書体に合う既存書体の漢字と組み合わせる）がどんどん出てきました。

時間の関係で、Webフォントのお話は、いくつかの導入事例にとどまりましたので詳しい情報をいくつか紹介します。またの機会にお会いしましょう。どこかで見かけたら、「フォントおじさんですよね！」とお声掛けいただけるとうれしいです。

フォントおじさんおすすめのフォント関連リンク集

日本語Webフォント10年間の歴史に迫る（PDF資料ダウンロード/139頁）
http://bit.ly/wcosaka2019-fontojisan

WordCamp Osaka 2019（動画/45分）
https://wordpress.tv/2019/12/21/hiroyuki-sekiguchi-adopted-wordpress-for-fontplus-at-third-renewal/

MdNからのインタビュー記事（2019年10月取材）
Webフォントって重くない？ クライアントに導入を認めてもらう秘策とは？ 巷で人気の“フォントおじさん”が教えてくれたWebフォントの最新事情
https://www.mdn.co.jp/di/special/4663/67977/

Web担当者Forumからのインタビュー記事（2019年4月取材）
Webフォントってなに？ 遅くないの？ SEOにはどうなの？ 「フォントおじさん」こと関口さんに聞いた。
https://webtan.impress.co.jp/e/2019/04/04/32138

!important #10 「ウェブと紙」（PDF資料ダウンロード/127頁）
本資料109〜120ページで「N仕様」の説明を掲載
http://bit.ly/important10-webfonts

Webフォントおよびフォント全般で、知りたいことや質問があれば相談に乗りますよ。FONTPLUS以外の質問でも、なんでもお答えします。

Facebook
https://www.facebook.com/hiroyuki.sekiguchi.8/

Twitter
@HiroGateJP

Mail
hsekiguc@tech.softbank.co.jp

FONTPLUS
Webフォント・サービス FONTPLUS

良太郎

フリーランスのグラフィックデザイナー／アートディレクター。紙媒体を中心に中小企業の課題を相談からデザインによる解決までを受託で行う。

補足

「日本人のローマ字表記 来年１月から「姓・名」の順 - 産経ニュース」

…政府は25日、公文書における日本人名のローマ字表記について、来年1月1日から原則「姓－名」の順とすることを決めた。関係する中央省庁で申し合わせた。姓を明確にしたい場合は、全て大文字にする方針も確認…

…一方、クレジットカードなど民間では名－姓の順が浸透しているところもあるため、「ただちに一般社会に影響を与えようとは考えていない。各業界はそれぞれの判断でやってもらえればいい」としている…

「フォントのインストール許可」は「iPadOS」だけでなく、「iOS」の両方で可能

…最新のiPadOSおよびiOS13ではフォントをアプリとしてAppStoreからインストールして管理できる仕組みが用意されています。「Font Diner」はこの新機能を活用したおそらく初めてのフォントインストール対応アプリとなります。』

…iOS 13とiPadOS 13以降では、サードパーティ製のカスタムフォントを使用でき、[設定]（[一般]>[フォント] ）でのフォント管理が可能となりました。Creative Cloudアプリの更新はこれに対応したもので、フォントの変更はシステム全体に反映されます。…

その他

Facebook : https://www.facebook.com/ryotarox
※セッションで使わなかった題材を公開していく予定です。

CSS Nite実行委員会

CSS Nite Shift13のフォローアップを公開します。

CSS Nite公式サイト
5 years 9ヶ月 ago

Shift13：Webデザイン行く年来る年（CSS Nite LP59）

2019年12月21日に浅草橋ヒューリックホールで開催したCSS Nite Shift13「ウェブデザイン行く時代来る時代」のフォローアップを公開します。

「アクセシビリティ」、「フォント」、「デザイントレンド」セッションは、追って公開します。

CSS Nite実行委員会

CSS Nite Shift13フォローアップ（5）「動画」セッション

CSS Nite公式サイト
5 years 9ヶ月 ago

2019年12月21日に浅草橋ヒューリックホールで開催したCSS Nite Shift13「ウェブデザイン行く時代来る時代」のフォローアップとして、後藤 賢司さん（よつばデザイン）たにぐち まことさん（ともすた）の『字幕がつなぐ、ウェブと動画のこれからの関係』セッションのスライドなどを公開します。

フォローアップ

たにぐちさんから

動画セッションを担当したたにぐちです。

CSS Nite Shiftは、クリエイティブはもちろんのこと、マーケティングやアクセシビリティなども学べるイベントです。

そこで、動画セッションでは動画マーケティング、動画アクセシビリティにも通じる話として、「字幕（CC）」を取り上げました。
動画コンテンツはこれから、情報伝達やマーケティングに欠かせないツールになっていきます。その時、どうしても撮影やカメラ機材に凝ることに視点が行きがちですが、その時に是非少し字幕を作ることで、多くの人たちに映像を届けるという所にも、目を向けてみていただければ幸いです。

頂いたご質問への回答です。

Q. 動画の編集には、どんなソフトを使っていますか？

私の場合、ほとんどの動画が「教材動画」なため、Camtasia Studioという統合編集ソフトを使っています。
https://www.techsmith.co.jp/camtasia.html

撮影から編集、カメラとの合成や、ナレーションの収録などが1本のソフトで行えます。字幕の作成ももちろん可能です。

その他、編集ソフトとしては次のようなものがあります。

Adobe Premiere Pro
https://www.adobe.com/jp/products/premiere.html

DaVinci Resolve
https://www.blackmagicdesign.com/jp/products/davinciresolve

Final Cut Pro
https://www.apple.com/jp/final-cut-pro/

Adobe Premiere Rush
https://www.adobe.com/jp/products/premiere-rush.html

Luma Fusion
https://apps.apple.com/jp/app/lumafusion/id1062022008

後藤さんから

動画セッションに登壇したよつばデザインの後藤です。
ご参加いただきありがとうございました。

ウェブサイトでの動画の活用は今後大きな需要があると考えます。
時間の関係で説明できなかった所もあったので内容を追加して記事にしました。
事例も追加していますのでご興味ある方は見ていただければと思います。
https://note.com/kenjigoto/n/ncb7c5ac2623e

新しい通信規格5Gがスタートすれば完全に使い放題となるので動画を閲覧する環境が大きく変わります。
求められる表現も変わる可能性があります。
リッチな表現を提供するというよりは、テキストや画像では伝えづらい部分をよりわかりやすく提供するために動画を活用すると考えていただければと思います。
人と人とをつなぐためのきっかけを作るために動画を使うという視点も大事だと考えます。

ユーザーが求める動画に対する感覚も重要になります。
あまり興味がない上司の子供の運動界のビデオを見せられるのが苦痛なように、発信側の目線でなく受信側のユーザーに見てもらえる動画
を目指す必要があります。
これから動画を始めようと思ってる方はまずは1ユーザーとして楽しむ事をオススメします。
動画を作る手法も大事ですが、動画をどんな切り口でどう作っていくかについても興味をもっていただければと思います（需要があるのは後者です）。
動画クリエイターになる必要はありません。クライアントに対してどんな価値を提供できるかの目線で動画を活用していただければと思います。

下記グループを運営していますのでご興味ある方はご参加ください。
ビジネスで動画活用するための情報交換所
https://www.facebook.com/groups/297169024407783/

いただいたご質問にお答えします。

Q.動画編集のおすすめのツールを教えてください。

A.私自身はPremiere Pro を使っています。
WordPressサイトの操作説明動画にはScreen Flow（Mac用）というアプリを使っています。画面録画から編集までひとつで出来るのでオススメです。
操作説明動画は寂しくなりがちだったりノイズ音が気になったりするのでうっすらBGMを入れるようにしています。

Q.ウェブサイトのトップページに掲載する動画の容量を教えてください。

A.基本はYouTubeにアップしたものを読み込んでいます。動画サイズはFHDで書き出しているので数十MB〜100MBちょいぐらいが多いです。
YouTubeは回線状況に合わせて動画のサイズを自動で調整してくれるので読み込み速度についても気になる事は無いです。
YouTubeなどを介さずレンタルサーバーに直接動画をあげていると転送量の制限がかかったりサーバーが不安定になるのでご注意ください。

あんこ情報もいただきありがとうございます。

CSS Nite実行委員会

CSS Nite Shift13フォローアップ（4）特別セッション

CSS Nite公式サイト
5 years 9ヶ月 ago

2019年12月21日に浅草橋ヒューリックホールで開催したCSS Nite Shift13「ウェブデザイン行く時代来る時代」のフォローアップとして、権 成俊さん（ゴンウェブコンサルティング）の『ウェブサイトをビジネスから考えるための競合分析』セッションのスライドなどを公開します。

フォローアップ

DXには、デジタル、デザイン、ビジネスの3つの理解が必要だと言われています。ウェブ業界人の多くは、デジタルとデザインには強いので、あとはビジネスを学ぶだけ。

今回の大西製粉さんの事例でお伝えしたかったのは、もし分析をしていなかったらどうなっていたか、ということです。従来のサイトコンセプトの延長で、改善を繰り返したところで、限界は見えています。調査分析によって、まったく新しいアイデアが生まれ、全く新しいsobayu.jpの企画につながりました。

ウェブサイト制作に携わる皆さんのお仕事の中でも、実は同じような状況があると思います。もはや言われたとおりにウェブサイトを作るだけでは成果は出ません。成果の出ない仕事を続けることは、不信感につながりますし、ウェブ業界全体への不信感を生んでいます。ウェブサイトを作るなら、ウェブ中心消費行動を理解し、新しい環境の中で新しい戦略を立てることから始めましょう。私のセッションで少しでも感じることがあった方は、チャレンジしてみてください。

やるなら今です。いずれにしましても、ご興味のある方はWebCA通信にご登録ください。

https://www.facebook.com/groups/399499957563391/

アンケートでいただいた質問への回答

Q.ウェブディレクター、デザイナーが戦略やビジネスを学ぶには

A.まずはAB3C道場へ

まずは戦略を立案したら、こんなに変わるのか、という感覚を身につけるのが良いと思います。今回ご紹介した大西製粉さんの事例もそうですが、そば粉のサイトがsobayu.jpになりました。もし、戦略を立てよう、と思わずに、そのままリニューアルしていたら、まったく成果は出なかったでしょう。sobayu.jpもまだやってみないとわからないですが、少なくとも、「これならいけるかも」というイメージを抱いてサイト制作をします。これが大切です。

AB3C道場　開催スケジュール
https://www.webconsultant.or.jp/event/

直近ですと、ウェブ解析士協会さんとの共催のこちらが一番初心者向けです。
https://web-mining.doorkeeper.jp/events/101469

Q.資格はとったほうがいい？

A.必要な人だけ取得してください。

WebCAで提供しているのは、教育とマッチングです。コンサルタントは最終的には個人の信頼が無いと仕事を受けることは難しいので、資格は重要ではないと考えています。しかし、ウェブサイトへの関心がまだ低い地方や、実績が少ない方にとっては、資格は興味を持ってもらうチャンスです。また、資格はWebCAの基準をクリアしているという証明ですので、WebCAからも仕事を紹介させていただく場合があります。

Q.資格を取るには？

A.ウェブアドバイザーから、最低半年です。

いくつか資格がありますが、ウェブコンサルタントとしての資格のなかでもっとも初球のものはウェブアドバイザーです。ウェブアドバイザーは地域のお店など、競争の少ない環境での戦略立案をメインに担当する方をイメージしています。いつくかの講座の受講と、レポートの提出、ディスカッションに参加していただきます。講座への参加日数は合計で12日となっていますが、ご自身でのレポート作成期間は含まれておりません。また、各講座は半年に1回ずつ開催されておりますので、一周受講するには半年程度はかかります。

Q.ウェブコンサルタントとウェブ解析士との違いは？

A.ゼネラリストか、スペシャリストか、というのが一番大きな違いだと思います。

ウェブ解析し協会さんとは交流がありますし、江尻さんからもたくさんの会員さんをご紹介いただいています。そのかかわりの中で、私が理解している限りでの意見ですが、ウェブ解析士協会は、その名の通り、ウェブサイトの解析を普及させるために作られた組織だと思います。特にGoogle analyticsの普及期に、解析の基本を多くの方に広めるために作られました。しかし、最近はベテラン会員さんを中心に、戦略や、ビジネスよりの講座などもやっておられるようです。

それに対してウェブコンサルタント協会は、分かりやすく言えば、ウェブに詳しい経営コンサルタントを育成すること、またクライアントとのマッチングを目的として組織された団体です。そのため、学ぶ範囲が非常に広く、ビジネス、ウェブ、デザインという広い範囲を扱っています。範囲が広いからこそ、基礎的なことはあまりやっておらず、実践的な体験の機会を提供するようにしています。

講義の内容も、実際の事例をもとにしたグループワークやディスカッションが中心です。経験を積むと、協会で受けた仕事のチームに参画し、OJTとして学ぶ機会もあります。資格試験もプレゼン形式で、いわゆるペーパーテストはありません。

Q.競合はネットだけではなくリアルも見るなど、どのように探すか

A.カスタマージャーニーに沿って、どのような競合が見えてくるかを考えます。

商品によって、最初の認知が店舗だったり、ネットだったり、また比較はどんな媒体でどこまで比較するか、というのが違います。消費者の行動シナリオを読み解きながら、それぞれの段階で見えてくる比較対象を競合と考えます。実際にやってみると、競争の激しい業界だとたくさんの競合を比較して、価値目を探る必要があります。逆に、競争がそれほど激しくない業界、例えば、地域を限定したローカルショップ、つまりラーメン屋などの場合は、競合となるお店が限られますから、調査も簡単で済みますし、AB3Cを成立させることも難しくありません。

Q.分析はウェブデザインとどのようにかかわっているか

A.誰に、何を、を定義しています。

大西製粉さんの事例でもご紹介したように、分析によって、ターゲットも、メッセージも変わりますから、ウェブサイトのデザインもコンテンツも変わります。ペルソナを意識する方は多いですが、その前提にあるユーザーモデル、つまりターゲットユーザーの必要条件の方を十分に検討しましょう。

Q.分析の費用はどう決める？

A.成果＞費用＞分析コスト

基本的には工数積み上げで計算します。たくさんやるほど戦略の信頼性は上がりますが、工数はかかります。その費用を回収するためには、達成しなければならない成果も大きくなくてはならないということです。そのため、「ここまでやればだいたい勝ち目はみえる！」というバランスを見極めなければなりません。その判断自体が経験に依存しますので、難しいのですが、見積もりの視点としては、高すぎず、安すぎず、というバランスを考える、ということです。

たとえば、今回の大西製粉さんの場合、期間としては2か月くらい、賞味2週間くらいでしょうか。費用は100万円でした。これを回収するためには、粗利率50％と考えると、200万円の売り上げが必要です。2000円/㎏のそば粉を1000個です。一年でペイさせるなら、毎月80個、居酒屋が毎月10個買ってくれるなら、8店舗顧客を開拓出来たらペイする計算です。

分析費用だけでお話しするとこの通りですが、実際はサイト制作もやって、500万円くらいかかるとするなら、その5倍です。今回の提案は、その数十倍の市場性はあると判断して、ご提案しています。

ちなみに、上場企業など、もともとの事業規模が大きい場合、どのくらいの収益インパクトを求めているかで、見込みがあっても市場が小さすぎて意味がないことが良くあります。このあたりは、大企業のイノベーションが難しい理由でもあります。

Q.大企業でもAB3C分析は活用できますか？

A.もちろん、活用はできますが、実行が難しいです。

私たちも15年くらい前は広告代理店や証券会社などの紹介で、大企業の支援をしていました。しかし、根本的な解決のために、戦略を提案しても、大企業はなかなか動きません。経営者自身がやりたくても、他の役員や、株主の承認が必要だからです。これを解決するために、最近はデザイン経営という考え方を取り入れよう、という流れがありますが、相当なリーダーシップのある経営者でなければ難しそうです。

そのため、当社のクライアントは、未上場企業で、社長ご本人が直接相談に来ること、決算書3期分を最初に用意してくれることが条件になっています。

Q.レビュー分析をやってみたいが、レビューが入手しづらい商材の場合はどうしたらいい？

A.お客様が求めているものを知る方法は、ユーザーインタビューやアンケート調査など、いくつかあります。

レビュー分析の良いところは、ユーザーの求めている価値を、簡単に手に入れられることです。レビューがたくさん手に入るなら、ぜひやってほしい分析方法ですが、他の古典的な方法もより深い理解が出来ますし、良い方法だと思います。ただ、コストの桁が変わってきますので、出来ればレビューを入手したいですね。

自社のレビューの限れば、レビューを書いてもらえるシステムもありますし、問い合わせ窓口への常日頃の問い合わせから、感想や要望を吸い上げていく方法などもあります。

以上です。ありがとうございました。

CSS Nite実行委員会

CSS Nite Shift13フォローアップ（3）「アドビ」セッション

CSS Nite公式サイト
5 years 9ヶ月 ago

2019年12月21日に浅草橋ヒューリックホールで開催したCSS Nite Shift13「ウェブデザイン行く時代来る時代」のフォローアップとして、浅野 桜さん（タガス）、黒野 明子さん（ crema design）の『2019年Adobe最新情報＋αをしっかりおさえる30分！』セッションのスライドなどを公開します。

フォローアップ

くれまこと、黒野明子です。「くれまとさくら」コンビによる「アドビ」セッション、30分という短い時間のなか、幅広め＆深さ浅めに各アプリをご紹介しました。

なにか興味を持たれたアプリがありましたら、ぜひAdobe MAX Japanのビデオアーカイブで情報を深堀りしてみてください。

浅野桜（さくら）と黒野明子（くれま）のセッションも、下記リンクの21番と22番でご覧いただけます。皆さまのデザインライフが、 2020年も豊かになりますよう。ONE TEAMで楽しく制作していきましょう！

▼Adobe MAX Japan 2019ビデオアーカイブ

さくらこと、浅野桜です。今年もアドビを中心にアプリのニュースをお届けしてまいりました。クラウド化やAIなどの最新機能の登場により、アプリの種類を問わずひとりの「職人」が突き詰めて制作するというスタイルは過去のものになるつつあるのかもしれません。

一方、こういった最新機能は「どう使うか」が大事。そのためにはまずは「知る」ところからですよね。XDをはじめとしたアプリのアップデート合戦はますます加熱することが予想されますが、すべてを常に追い続けるのは大変です。年末のShiftで皆さんの知識もアップデートできれば幸いです！

関連リンク

Q&A

Photoshop 2020が重くなったような気がします。

→ Photoshop 2020からはシステム構成要件が変更されました。

また、こちらのヘルプも参照してみてください。

XDの共同編集を使用する際、編集してほしくない部分をロックなどできると良いですね。

→ 共同編集はβ版ということですので、今後のアップデートに期待しましょう！　今回私たちはXD以外で（たとえばチャットなどで）担当箇所を割り振りながらアートボード外に作業メモや分担がわかるものを残しておき、お互いに作業がバッティングしないようなフローで作業をしました。

クラウドを使うようになってから、ドキュメントの整理整頓に悩んでいます。お二人はどうしていますか？

→ 確かにクラウドドキュメントにはフォルダ的な機能が無いので、整理できないですよね。黒野は、2019年12月の時点では、ローカルでドキュメントを整理し、共同編集とアセットの取り込みが必要な際だけ、複製をクラウド上に上げるようにしています。これも今後のアップデートに期待ですね。

XDに関して、外部ファイルのアセットを読み込んだのに、アセットが更新されなくなるバグに悩んでいます。

→ 黒野はまだこのバグに遭遇したことがないのですが、下記の方法でリカバリーできるかもしれません。確約できないので、ドキュメントをローカルにバックアップするなどして、試してみてください。

一度読み込み元のドキュメントをクラウド上から削除し、下記の記事で紹介されているようにアセットを再リンクしてみるといかがでしょうか？

リンクされたアセットの操作

もしどうしてもバグが治らないということが明らかであれば、下記のユーザーフォーラムで質問してみるのも良いと思います。基本のやり取りは英語ですが、日本語で投稿しても、分かる方がお返事してくださる場合があります（英語の方が確実ですが）。 Adobe XD Feedback : Feature Requests & Bugs

XDの「Quick Mockup」には触れていませんでしたが、まだ早いでしょうか？

→ 今回は時間と構成の関係上触れなかったのですが、「Quick Mockup」には期待が高まりますよね！　現在はまだベータ版ですので、すぐに実戦投入するよりは、サイドプロジェクトなどでテストしてみてはいかがでしょうか？　

お使いになった上でのフィードバックをアドビに寄せられると、さらに本番リリースの精度が高まっていきますね。XDのように開発サイクルが速く、開発陣がユーザーの意見をオープンに聴く姿勢を示している製品は、「みんなで育てる」意識で付き合っていくと、より良い結果につながると考えています。

XDでのアセット登録は、画質が担保されるか気になりました。

→ この件に関しては完全な答えはないのですが、Adobe Community Evangerist同士で情報交換したところ、下記のような意見が上がりました。

  • アセットへのビットマップ画像登録のタイミングではなく、XDの取り込み時に解像度が下がる現象がある。
  • JPGファイルをドラッグ＆ドロップすると、XD任せのサイズになることがある。
  • Office製品からの画像のコピペだと、情報量は減らないのにサイズが変わる現象が確認できている。
  • 対処法としては、XD内にレイアウトしたビットマップ画像はそのまま書き出し用として利用せず、コーディング直前にオリジナルのPSDから画像を書きだすということが考えられる。この方法を推薦するもう一つの理由としては、XDではカラーマネジメントがされないので、シビアなクオリティコントロールが求められる画像書き出しはPhotoshopで行うほうが現状としては安心というポイントもある。
CSS Nite実行委員会

CSS Nite Shift13フォローアップ（2）「マーケティング」セッション

CSS Nite公式サイト
5 years 9ヶ月 ago

2019年12月21日に浅草橋ヒューリックホールで開催したCSS Nite Shift13「ウェブデザイン行く時代来る時代」のフォローアップとして、益子 貴寛さん（まぼろし）、吉村正裕さん（サイバーアシスト）の『トレンドを総ざらい ウェブマーケティング』セッションのスライドなどを公開します。

フォローアップ

マーケティングセッションを担当した益子貴寛です。

アンケートでは「知らない話題が多くて勉強になった」という声が多く、吉村さんと一緒に、熱心に準備した甲斐がありました。

クリエイティブワークに関わる人間が、政治・経済ネタを真正面から語ることに少し気恥ずかしさはありつつですが、私たち一人ひとりはもちろん、若者や子どもたちの未来に関係することですので、何となくでもウォッチしておきましょう。

  • スライド（PDF）の各スライドをクリックすると、そのページが開けます
  • 本編ではカットした「おまけネタ」を、最後に入れておきました
  • Voistaのユーザー登録、応援だと思って、ぜひお願いできれば幸いです
  • 特に関西方面の方は、1月11日開催の第6回 全国ECサミット in 大阪にご参加ください

質問への回答

以下、アンケートでいただいたご質問に回答します。

Q：YouTubeでほかにおすすめのコンテンツはありますか？

益子の回答：時事ニュースであれば、平日8:00から10:00まで配信している「虎ノ門ニュース」がおすすめです（アーカイブも見られます）。私は毎日、仕事をしながらアーカイブを見る（聞く）ことを日課にしています。

吉村の回答：私も「虎ノ門ニュース」は週２回程度チェックしています。

経済ニュースのチェックには「日本経済新聞」「チャンネルくらら」、事業主さんにおススメは「税理士YouTuberチャンネル!! / ヒロ税理士」、起業家さんにおススメは「令和の虎CHANNEL」などです。

Q：ヤフーとLINEの経営統合から、どのような影響がありますか？

益子の回答：LINEは日本だけでなくアジア各国（タイ、台湾、インドネシア）でも普及していますので、ヤフーのアジア圏への勢力拡大がもっとも大きいと思います。

ほか、LINEのスーパーアプリ化（ますます生活必需アプリになる）、ヤフーのTポイントからの離脱、PayPayとLINE Payの統合による決済シェアの拡大、ソフトバンクユーザーへのサービス強化、高齢者向けサービス強化（LINEは高齢世代にも普及しているので）などが考えられます。

なお、ヤフーの親会社であるソフトバンクは、WeWorkなどへの投資に失敗し、株主から大きな批判を受けています。LINEとの経営統合を急いだのは、鷹野さんの言葉を借りれば「ダメージコントロール」が大きな理由といえそうです。

Q：瀬取り（せどり）業者を排除する方向ということで、個人でこのような行為をしている人にも同じ影響があるのでしょうか？

吉村の回答：「電脳せどり」についてですが、中国の新EC法では「EC事業者は企業登記を行わなければならない」としており、実態の事業所がない者への排除を目的としていますが、「少額取引の活動」については事業者としての登録を免除する条項もあるようです。

ただ「少額」がいくらまでなのかが定義されていないようなので、今後この部分が個人の少額事業者にまで拡大解釈される可能性もあります。

また、今年のWTOフォーラムで、中国を含む76カ国・地域が電子商取引の国際ルールについて今後交渉を始めるという合意がなされました。

特に越境ECに関する国際ルールはこれまで殆ど存在しなかったため、今後「消費者のオンライン環境への信頼改善」ということを強化し、ECプラットフォームに対する規制のメカニズムを構築し、監視体制を強化していくと思います。

CSS Nite実行委員会

CSS Nite Shift13フォローアップ（1）基調講演

CSS Nite公式サイト
5 years 9ヶ月 ago

2019年12月21日に浅草橋ヒューリックホールで開催したCSS Nite Shift13「ウェブデザイン行く時代来る時代」のフォローアップとして、中川 直樹さん（アンティー・ファクトリー）、志水 哲也さん（タービン・インタラクティブ）の『基調講演：2020年、ウェブ業界で活躍し続けるために』セッションのスライドなどを公開します。

フォローアップ

基調講演を担当したタービン・インタラクティブの志水哲也です。
カジュアルな演出で楽しくお届けしましたが、ベースになっているのは環境変化やそのスピードに対する大きな危機感です。

40人規模のウェブ制作会社が生き残り、成長するためには、自社を変化させ、現在の自分たちをも陳腐化する必要があります。
私たちも戦略的に、自社を「ウェブ制作」から先へ進化させてきました。

2020年をご活躍いただくために掲げた3つの方向性は、その経験からのアイディアを元に、中川さんのご意見を加えて調整したもの。
新人かベテランかを問わず、また、個人が法人化を問わず有効な考え方です。

2020年に向けたチェックとガイドにご利用いただければ幸いです。
ご参加ありがとうございました。

同じく基調講演を担当したアンティー・ファクトリーの中川直樹です。
2020年代を迎えるにあたり、この先、必要とされる人材や能力、マインドの持ち方などについて何か伝えれば、というのが、今年の基調講演のメインテーマでした。

セッションを通して、言われてみれば、当たり前じゃん！と、いうことばかりだったかも知れませんが、業界に長年いて、年齢を重ね、結局、楽しく働き抜くために重要なことって「好きこそ物の上手なれ」である気がします。

そして、一生懸命、取り組んでいれば、結果、周りが認めてくれ、好意も寄せてくれ、様々な仕事を通してネットワークも広がっていくものです。

2020年代も、業界で楽しく仕事が続けられるよう頑張りましょう！！
ありがとうございました。

株式会社タービン・インタラクティブ
https://www.turbine.co.jp
志水哲也

株式会社アンティー・ファクトリー
http://www.un-t.com
中川直樹

CSS Nite実行委員会

キャンセル規定の変更（2020年）

CSS Nite公式サイト
5 years 9ヶ月 ago

キャンセル規定を次のように変更します。

従来

  • 返金期間は開催の7日前まで
  • 希望される方はビデオ参加費を除いて返金

2020年から

  • 返金期間は開催の8日前まで
  • 全額返金
  • ビデオ参加を希望される場合には、別途、お申し込み

開催の8日前までであれば、懇親会費を含めて全額返金が可能ですので、早めのお申し込みが「吉」です。

CSS Nite実行委員会

これまでの開催と参加者数（2019年12月）

CSS Nite公式サイト
5 years 10ヶ月 ago

2019年12月、CSS Niteでは667回の関連イベントを通して、67,829人の方にご参加いただきました。

区分 開催数 動員数 %
地方版 314回 26,091人 38.47%
LP 64回 13,390人 19.74%
CSS Nite in Ginza 72回 10,411人 15.35%
その他 30回 5,036人 7.42%
Shift 13回 3,276人 4.83%
After Dark 45回 1,815人 2.68%
クリ☆ステ（クリーク・アンド・リバー社とのコラボイベント） 16回 1,493人 2.20%
CSS Niteビギナーズ 9回 1,041人 1.53%
マイクロソフトとのコラボイベント 9回 996人 1.47%
『10倍ラクするIllustrator仕事術』全国セミナーツアー 33回 987人 1.46%
CSS Nite in SEOUL 4回 919人 1.35%
CSS Nite back2basic 26回 888人 1.31%
Co-Edo 20回 524人 0.77%
Web担当者Forum x CSS Nite 実践ワークショップ 6回 519人 0.77%
CSS Nite redux（再演版） 6回 443人 0.65%
667回 67,829人 100.00%

その他

  • Aquent Gymnasium LIVE w/ CSS Nite
  • BuWis in Matsuyama 「地方組織を強くするブランディングの実践論」
  • CSS Nite in Omotesando
  • CSS Nite shuffle
  • CSS Nite特別編： 西脇 資哲のスーパープレゼンセミナー
  • 『効率的なサイト制作のためのDreamweaverの教科書』出版記念セミナー
  • ノン・デザイナーズ・アカデミア 〜Design for the rest of us
  • 帰ってきたWeb研
  • Web標準の日／Web標準の日々
CSS Nite実行委員会

CSS Niteベストセッション2019を発表します

CSS Nite公式サイト
5 years 10ヶ月 ago

2019年、CSS Niteでは49回の関連イベントを通して123セッションが行われました。

その中からベスト・セッション＋αを選びました。 https://cssnite.jp/archives/best-session2019.html

一部のセッションが近日公開になっていますが、すべてのセッションのスライドや動画を公開しています。

ベストスピーカー

  • 植木 真（インフォアクシア）、辻 勝利（コンセント）

殿堂入り

  • 中川 直樹（アンティー・ファクトリー）
  • 草間 淳哉（ウェブエイト）

ベストスピーカー（次点）

  • 権 成俊（ゴンウェブコンサルティング）
  • 井水 大輔（エスファクトリー）
  • 筒井 美希（コンセント）

ベストセッション

プロジェクトをうまく進めるた　めに、コーダーが進化するためのテクニック

大串 肇（mgn）

ベストセッション（次点）

Webデザイントレンド

原 一浩（カンソクインダストリーズ）／矢野 りん（バイドゥ）

ベストセッション10

インハウス で〝カイゼン＆グロース〟を実践すれば成功できる！

谷脇 しのぶ（へノブファクトリー）、林田 拓郎（へノブファクトリー）

デザイン制作工程で工夫できること

角田 綾佳（キテレツ）

現場で活用できるマイクロインタラクションの作り方

池田 泰延（ICS）

Adobe XDの自動アニメーションで作るプロトタイプ

松下 絵梨（ツキアカリ）

水産業とクリエイティブ

安達 日向子（フィッシャーマン・ジャパン）

企業が動画メディアを始める理由と、YouTubeの育て方

たにぐちまこと（H2O space ／ともすた）

現場で働くコーダーのためのCSS Grid + モダンコーディング

鹿野 壮（ICS）

Web制作現場の働き方とワークフローが変わる Adobe XD活用法

益子 貴寛（まぼろし）

起業にまつわるデザイン

吉村 正裕（サイバー・アシスト）

名刺デザインから考えるクリエイターのためのSNSブランディング術

上司ニシグチ

ベストセッション20

おさえておきたい文字まわりのトレンド 2019

関口 浩之（ソフトバンク・テクノロジー）／鷹野 雅弘（スイッチ）

ウェブ制作に活かすユニバーサルデザインの視点

間嶋 沙知

ウェブ開発のいまと、コーディングしない制作手法

阿部 正幸（モチヤ）

あなたの価値を高めるアクセシビリティ

伊原 力也（freee）

ウェブページを高速化してユーザーに価値を届けたい制作者のためのセミナー＆ワークショップ

佐藤 歩（サイバーエージェント）

Webフォントを120%活用するための基礎知識＆最新動向

松田 直樹（まぼろし）

むずかしい！と言われないためのお客様とのコミュニケーション術

高木 剛志

対症療法から根本治療へ〜戦略から考え直すウェブ活用

黒瀬 直樹

IoM（Internet of Me）時代のコミュニケーション

伊藤 光弘

すぐにできるMacの作業効率化入門 第二部　〜繰り返し作業をもっとラクに！ アプリの活用で価値を生み出すステップアップ編〜

サイトウマサカズ（N’s Creates）・TD・上西 啓司

選外（非公開のため）

地方都市でもできる！最新ツールと泥臭さのブランディング

半田 惇志

誰もが隣にいる人と一緒に楽しむために

松森 果林（聞こえる世界と聞こえない世界をつなぐユニバーサルデザインアドバイザー）

ブランディングを事業戦略に！　コーポレートブランディングとサービスブランディングの違いとその役割、プロセスについて

辻原 咲紀（アイリー）

ベスト・マインドセット

良いデザインのための、マインドセットの作り方 待島 亘（Gear8）

ベスト・パッション

映像で生きていく 椿 英明（グリッド）

ベストスライド

Nuxt.jsがもたらすWordPressの新たな可能性 カイト（キテレツ）

新人賞

ほっこりイラストレーターが結果を出すためにやったこと、やらなかったこと ＊Haiji＊（スタジオいっぽ）

ベスト・小芝居

デザイナーとコーダーをつなぐ、Adobe XDを用いたモダンなウェブ制作 鹿野 壮（ICS）、松下 絵梨（ツキアカリ）

ベスト・マーケティングアナリスト

  • 寳 洋平（アユダンテ）

ベスト・地方版イベント

  • CSS Nite in Fukushima, vol.7
  • CSS Nite in Okayama, vol.9

ベスト・地方版

  • CSS Nite in Kobe
CSS Nite実行委員会

CSS Nite After Dark 2019 「現場で活用できるマイクロインタラクションの作り方」のフォローアップを公開します

CSS Nite公式サイト
5 years 10ヶ月 ago

2019年3月19日に開催したCSS Nite After Dark 2019の池田 泰延さん（ICS）の『現場で活用できるマイクロインタラクションの作り方』フォローアップを公開します。

メッセージ、補足など

マイクロインタラクションのセッションにご参加いただき、ありがとうございました。

今回のセッションでは、マイクロインタラクションの役割から、モーション系のツールで作る話、エンジニアがCSSやJavaScriptで実装する段階まで具体的に紹介しました。

ウェブサイトにマイクロインタラクションを実装しようとするとデザイナーやエンジニアのプラスアルファの作業となることが多く、実装工数は増える可能性があります。実装工数が増えようとも、ユーザー体験の向上のために提案できることは大事です。そのため、マイクロインタラクションの必要性をお伝えすることに注力しました。プロダクトが目指すユーザー体験を実現するために、マイクロインタラクションを活用していきましょう。

フォローアップでは、発表での補足とお寄せいただいた質問をいくつかピックアップして回答します。

アンケートでいただいた質問に関して

たくさんのアニメーション用のコードを書くと重くなると思います。軽くするにはどのような手段がありますか？

「再生が滑らかでなく重たい」と「データ容量が重たい」の2つの意味が考えられます。今回は前者について回答します。

再生負荷に関しては、いくつかの最適化のポイントがあります。

  • ベクターグラフィックスだと再生負荷が高い → ビットマップ画像にする
  • 同時に表示している要素が多い → 数をへらす
  • フィルター効果（ぼかし）など高負荷なエフェクトを使っている → フィルターを使わない

一般的にDOMやSVGに比べて、HTML5 CanvasやWebGLのほうが描画性能は高いです。そのため、「再生が重たい」と感じたらHTML5 CanvasやWebGLの採用を検討するといいでしょう。参考までに、私が以前検証した記事を紹介します。同時に動かせる要素の数で比較すると、DOMだと3000個程度、WebGLだと40000個程度となります。

最速のアニメーションライブラリはこれだ！ JSライブラリの性能をDOMとWebGLで比較検証 - ICS MEDIA https://ics.media/entry/14993

Nuxt.js等で作成したシングル・ページ・アプリケーションでは、pjaxのようにURLが切り替わりますが、SEOとして問題ないですか

最近のGoogle検索エンジンはJavaScriptを解析すると言われています。しかし、確実に解析される保証がないので、HTMLのソースコードとして展開しておくことがベストプラクティスのひとつとして知られています。

Nuxt.jsの場合は、SSR（サーバー・サイド・レンダリング）という技術を使って、シングル・ページ・アプリケーションのページ内リンクを静的なHTMLファイルとしても生成できます。HTMLファイルが存在する状態となるので、通常のウェブサイトと同様に検索エンジンは解析してくれます。

次の資料がNuxt.jsのSSRについてわかりやすく説明されているので、参考にするといいでしょう。

Nuxt.jsによるAdobe MAX Japan 2018公式Webサイト制作の舞台裏 - Speaker Deck https://speakerdeck.com/haribote/nuxt-dot-jsniyoruadobe-max-japan-2018gong-shi-websaitozhi-zuo-falsewu-tai-li

マイクロインタラクション有り無しで見積もりを変えてしますか？

はい、変えています。 私の場合ですが、マイクロインタラクションを用意する前提ではじめに提案します。予算や期間が限られる場合に、他の要件と優先度を調整しながら、場合によってはマイクロインタラクションを削ります。

外注にマイクロインタラクションをどのように発注するか

構成案や仕様書に、絵コンテなどの形で明確に記載しておきます。「マテリアルデザインのリップルエフェクトをボタンに追加してほしい」といった共通言語を使って仕様書に記載しておくのもいいと思います。

After Effectsで作成したモーションはCSSやJSで再現できると思っていいでしょうか

残念ながら、かならず再現できるわけではありません。

After Effectsはもともと映像制作用のソフトウェアなので、ウェブに適さない部分もあります。たとえば、「エフェクト」はBodyMovinで書き出すと、ブラウザではまったく再現できません。また、複雑なパスアニメーションだと変換で壊れる場合があります。After Effectsで作成する際は、BodyMovinでの変換結果をこまめにブラウザで確認することが大事です。

マイクロインタラクションを勉強するために行っていることを教えてください。

アニメーションのセンスを磨き、アイデアの引き出しをためておくことが大事です。そのためには、さまざまなウェブサイトやアプリを普段から観察しています。たとえば、次のギャラリーサイトでセンスのいい動きをチェックします。

https://www.awwwards.com/ https://thefwa.com/

また、普段からアニメーションやマイクロインタラクションの練習として、小さなデモを制作するのもオススメです。ウォームアップができていると、いざ制作するときにすぐにアイデアがでてきます。アニメーションは試行錯誤がものをいう場面があります。アニメーションにおいて、予備動作（スケール変化など）が必要な場合とそうでない場合を判断することがありますが、そのときも普段から制作していると感覚的に判断がつくようになります。

文字1つ1つをspanタグで囲んでアニメーションしたところで、あとからpタグに切り替えるとおっしゃっていたと思いますが、具体的にどのように切り替えるのか教えて欲しいです。

サンプルの「1_texteffect」フォルダ内のJavaScriptを、そのような設計のコードにしてみました。アニメーションを始める前に元のinnerHTMLプロパティーのデータを変数にとっておき、アニメーションがおわったところで、innerHTMLプロパティーに再代入します。

CSS Nite実行委員会

CSS Nite in Sapporo, vol.22「デザインを語る夕べ」フォローアップ（4）鷹野 雅弘

CSS Nite公式サイト
5 years 10ヶ月 ago

2019年6月28日（金）にTen to Ten SAPPORO STATIONで開催したCSS Nite in Sapporo, vol.22「デザインを語る夕べ」のフォローアップとして、鷹野 雅弘さん（スイッチ）の『Photoshopの非破壊編集と“コンじる”の進化』セッションのスライドなどを公開します。

フォローアップ

リンク集（Photoshop）

コンじる（コンテンツに応じる）

「コンじる」については、次のように進化しています。

手法の変化

むかし（CS） いま（CC）
カンバスの拡張 [イメージ］メニューの［カンバスサイズ］でサイズ指定 [切り抜きツール］でドラッグ
ブラシの大きさ／硬さ ［/]、shift + [/] ブラシプレビュー
キズ・ゴミ取り ［スタンプツール］ ［スポット修復ブラシツール］
選択範囲を作成し、［編集］→［塗りつぶし］
選択範囲を作成し、［編集］→［コンテンツに応じた塗りつぶし］
「背景」レイヤーのロック解除 ダブルクリックしてダイアログボックスを表示してOK
 鍵アイコンをクリック
option + ダブルクリック
画像の回転 自由変形
ものさしでドラッグ後、カンバスの回転 ［切り抜きツール］の[角度補正］オプションを選択してドラッグ（［コンテンツに応じる］オプション）
ものさしでドラッグ後、オプションバーの［レイヤーの角度補正］ Camera RawフィルターのUpright
フィルター 生でかける スマートフィルター（スマートオブジェクトにしてからかける）
色調補正 調整レイヤー スマートフィルター
（調整レイヤーも使う）
マスク ビットマップマスク ＋ベクトルマスク

Mandal-Art（マンダラート）

『「A4」1枚アンケート』という手法で有名な岡本 達彦さんも「マンダラ広告作成法」として発展されています。

CSS Nite実行委員会
確認済み
58 分 5 秒 ago
「CSS」だけでなく、Web制作全般に関するトピックを取り上げるセミナーイベント。都内のほか、大阪、名古屋、青森、福岡、沖縄、秋田、札幌、福井、仙台、福島、広島、新潟、京都でも開催。 Movable Type Pro 4.23-ja
URL
CSS Nite公式サイト フィード を購読

新着記事

共創から“協働”へ『オウンドコミュニティ ファンと協働する新・マーケティング戦略のすべて』を3名様にプレゼント 11月21日 10:00 【2026年版!?】ローカルSEOランキング要因【SEO情報まとめ】 11月21日 7:00 セミナー満足度 ランキングTop10【Web担当者Forumミーティング 2025 秋】 11月21日 7:00 はじめやすく、続けやすく――TVer・Fit Place 24・Duolingoに学ぶオンボーディング設計のヒント 11月20日 7:00 モバイルファースト時代の到来 - 複雑化する広告運用にAIで立ち向かう［第4部 - 第50話］ 11月20日 7:00

人気記事トップ10

ボーナスが高い職種ランキング2025！ 年間ボーナス平均額は「120.7万円」に急上昇【パーソルキャリア調べ】 総務省が「ファイル共有ソフト」の不適切利用にあらためて注意を呼びかけ、特設ページ公開も 【2026年版!?】ローカルSEOランキング要因【SEO情報まとめ】 『機動戦士Gundam GQuuuuuuX』大成功の裏側　新旧ファンを同時に動かした“360度全方位”戦略 Hakuhodo DY ONEが検索連動型広告のアドフラウド対策を強化するサービス「Vantage Core」開始へ 共創から“協働”へ『オウンドコミュニティ ファンと協働する新・マーケティング戦略のすべて』を3名様にプレゼント 「LINE公式アカウント」の「チャットProオプション」に「AIチャットボット(β)」を追加 定額制動画配信サービスの最新状況、利用継続の判断でもっとも重視するポイントは？【オリコン調べ】 “指標の言い換え”で成果を示す、ステークホルダーに通じるSEOの話し方（後編） Amazon、年末のビッグセール「ブラックフライデー」11/24（月）～12/1（月）
ボーナスが高い職種ランキング2025！ 年間ボーナス平均額は「120.7万円」に急上昇【パーソルキャリア調べ】 アカチャンホンポで試供品を無料提供、アドインテのサンプリング自動販売機を活用 イオンが「電子マネーWAONポイント」を「WAON POINT」に統合、分かりにくさ解消 総務省が「ファイル共有ソフト」の不適切利用にあらためて注意を呼びかけ、特設ページ公開も 「推しアーティストランキング2025」発表！ 男性部門はSnow Man、女性部門はME:Iが1位に【エクシング調べ】 『機動戦士Gundam GQuuuuuuX』大成功の裏側　新旧ファンを同時に動かした“360度全方位”戦略 脱・自己流！ Excelではじめるデータ分析「聞くに聞けない」基本とスキル習得ロードマップ 【2026年版!?】ローカルSEOランキング要因【SEO情報まとめ】 “指標の言い換え”で成果を示す、ステークホルダーに通じるSEOの話し方（後編） 戦略の出発点は「顧客を知ること」 成果につながるマーケティングの進め方
ボーナスが高い職種ランキング2025！ 年間ボーナス平均額は「120.7万円」に急上昇【パーソルキャリア調べ】 「推しアーティストランキング2025」発表！ 男性部門はSnow Man、女性部門はME:Iが1位に【エクシング調べ】 イオンが「電子マネーWAONポイント」を「WAON POINT」に統合、分かりにくさ解消 総務省が「ファイル共有ソフト」の不適切利用にあらためて注意を呼びかけ、特設ページ公開も アカチャンホンポで試供品を無料提供、アドインテのサンプリング自動販売機を活用 脱・自己流！ Excelではじめるデータ分析「聞くに聞けない」基本とスキル習得ロードマップ AI活用は「プロンプト」より「コンテキスト」？ セールスフォースが語る“AIエージェントの価値” 2024年度「増収増益」企業は14.2万社、最多は建設業　石川・沖縄が上位に浮上【帝国データバンク調べ】 『機動戦士Gundam GQuuuuuuX』大成功の裏側　新旧ファンを同時に動かした“360度全方位”戦略 数字が苦手でも大丈夫！「生成AIデータ分析」超入門
人気記事ランキングをもっと見る

読者プレゼント

共創から“協働”へ『オウンドコミュニティ ファンと協働する新・マーケティング戦略のすべて』を3名様にプレゼント 11月21日 10:00

企画広告も役立つ情報バッチリ！ Sponsored

AI時代のマーケターは「創る人」になる――クリエイティブから分析までを1人で完結させる4つの事例 11月14日 7:00 AIで高品質なコンテンツは作れるか？ 品質を落とさず制作数を2.5倍にしたラクーンコマースのAI活用法 11月13日 7:00 SEOは終わらない。AI検索時代に求められるGEOの現状と対策とは？ 10月16日 7:00 石巻市が実践した「災害に強いウェブサイト構築」〜自治体DX成功の舞台裏〜 10月14日 7:00 ユーザーは“来訪前後”に「何を検索していたのか？」 ガリバー流 顧客理解のためのマーケティング術 9月29日 7:00 競合分析は“シーン”で使い分ける　6パターン別・分析手法と仮説の立て方 9月1日 7:00 AI時代に「クソコンテンツ」は通用しない！ SEO評価と信頼性を両立する絶対条件 8月25日 7:00 LIFULLが語る！ 施策成功率280％UP、CV10倍を実現した「プロダクトアナリティクス」の全貌 7月29日 7:00 A/Bテストだけでは見えない「顧客インサイト」を発見し、継続的なサイト改善を実現する4ステップ 7月25日 7:00 生成AIで検索体験はどう変わる？ 導入事例から見るサイト内検索のいま 7月24日 7:00

編集部からのおしらせ

共創から“協働”へ『オウンドコミュニティ ファンと協働する新・マーケティング戦略のすべて』を3名様にプレゼント 11月21日 10:00 セミナー満足度 ランキングTop10【Web担当者Forumミーティング 2025 秋】 11月21日 7:00 Web担当者Forum - 開発にあたって　開発スタッフと謝辞 11月18日 18:02 失敗しないサイト運営『オウンドメディアの教科書 成果につながる設計・運用・改善のすべて』を3名様にプレゼント 11月14日 10:00 ファンづくりの教科書『ファンダムマーケティング～「⁠今日の売上」と「明日の売上」を両立させる⁠～』を3名様にプレゼント 11月7日 10:00
すべて見る