2018年末にPayPayが開催した「100億円還元キャンペーン」をきっかけに利用者が一気に増えたQRコード決済。その後多くの企業が参入し、消費税増税とともに導入された「キャッシュレス・ポイント還元事業」の影響もあり、QRコード決済の利用者自体は右肩上がりで増え続けているようです。

しかしたくさんの「○○PAY」というサービスが存在していると、いざ始めようと思ってもどのサービスを始めるべきか悩んでしまいますよね。実際のところ最も利用されているのはどのQRコード決済サービスなのでしょうか。

気になって調べてみると、スマートフォン、タブレットを中心とした消費者動向や市場調査を無料で公開している日本最大のモバイル専門のマーケティングリサーチ機関「MMD研究所」のサイトに2020年1月時点での情報が掲載されていました。

https://mmdlabo.jp/investigation/detail_1834.html

こちらはQRコード決済サービスを利用したことがある人に対し、利用したことのあるサービスについて尋ねたデータです。

1位は「PayPay」がやはり圧倒的で全体の6割超。2位以降は「楽天ペイ」「LINE Pay」「d払い」「メルペイ」「au PAY」「ファミペイ」「Origami Pay」と続いていきます。そしてこのグラフを見るとほかにもたくさんのQRコード決済サービスが存在していることがわかりますね。

そんななか先日「メルペイ」が「Origami Pay」を提供している株式会社Origamiを買収するというニュースが報道されました。「Origami Pay」は「PayPay」よりも早くQRコード決済サービスを開始した業界でも古参のサービスです。

株式会社Origamiのメルカリグループ参画に関するお知らせ | Origami
https://about.origami.com/press/2020/0123/

こちらは買収と同時にOrigamiの社員の9割を削減する見込みとなっているため、事実上の経営破綻だとされています。しかし買収する側の「メルペイ」を提供する「メルカリ」も「メルカリ」への投資がかさんで赤字が膨れ上がっているそう。

メルカリの19年7～12月期、最終赤字が141億円に拡大　メルペイへの先行投資がかさむ – ねとらぼ
https://nlab.itmedia.co.jp/nl/articles/2002/06/news121.html

さらにメルカリとドコモが提携することも決まっていて、さらにはヤフーとLINEも経営統合に合意していることも発表されています。
「Pay Pay」と「LINE PAY」が統合されるかはわかりませんが、今後利用者の多いQRコード決済サービス同士の統合が進めば、どのサービスを利用するかを悩むこともなくなっていくでしょう。

ちなみに個人的に今後注目しているのは「au PAY」です。今まではauの提供する「au WALLET」というサービスの一部という形であまり目立っていませんでしたが、2月10日から決済金額の20％をポイント還元するキャンペーンを開始し、アプリ名も「au WALLET」から「auPAY」に改称。利用者拡大に力を入れていくようです。

私はもう10年以上auと契約しているのですが、以前は月々の支払いでたくさんのポイントを獲得してもほとんど使い所があまりありませんでした。「au PAY」が誕生してからはポイントを使って「au PAY」にチャージできるようになったため、常にauからお小遣いをもらえているような感覚があります。

auユーザーで「au PAY」を利用していないという方はこの機会に試してみるといいかもしれません。

こんにちは山形のWEBデザイナー菅野です。

Web制作に携わる専門職はいくつかに分けることができます。
別の方が2年前にもこんな記事を投稿してくれていました。

何をする人なの？ウェブ制作業界の職種

たとえばフロントエンド、バックエンド。
ざっくり言いますと
利用するユーザーが実際操作できる部分の機能をフロントエンド、
逆にユーザーには見えない中身のシステムをバックエンド
それぞれの作業を行うのが
フロントエンドエンジニア、バックエンドエンジニアというわけです。

図で表すとこんな感じ

だた私自身は日頃の業務のなかで、役割やポジションに関しては意識することはあまりありません。
なぜかと言いますと、基本的には最初の打ち合わせからデザイン、コーディング、そして公開まで私一人で作業することが多いからです。
CMSやシステムのカスタマイズが重要になる案件の場合は、システム業者さんに依頼する感じです。

会社員時代からWEB制作に関わるようになりましたが
WEB制作がメインの会社ではなかったため WEB担当者は私一人だけ💦
そんな環境でWEB制作をやっていましたので
一般的なWEB制作において
どのような役割で進めているかよくわかっていないんです😅
勉強しろよって ツッコまれそうですが…

正直 小規模案件だから一人でできる部分はあります
規模が大きいものになると
複数人のチームで動かないと対応できなくなるため
役割やポジションが出てくる訳ですね

 

私のいる山形では大規模の案件は少なく
基本的には下記の体制が多いような気がします

営業がプロデューサーからディレクターあたりの役割までこなし
その後をWEBデザイナーが作業する感じです

ですから周囲にも、デザインだけとかコーディングだけの制作者は少なくて
営業から公開まで全てを一人でやっている方もいます。
その中には、400ページを一人で進めている方もいれば、
月間200万PVのサイトの構築から管理まで一人でこなしているツワモノもいます😅
その方はフリーランスの方なのですが、
あまりにも忙しすぎて、人に会うことが少なくなり
久しぶりに人と会うと声がうまく出ないらしく
発声練習をしてから会いに行くそうです（笑）

 

スマホで簡単に使える動画編集ソフトが増えました。
自動編集の機能も優秀です。
http://wepress.web-magazine.jp/2020/01/22/6525/
http://wepress.web-magazine.jp/2019/02/01/dougajideouhennsyuu/

自動的に短く調整されたカットとカットの間には楽しい効果が追加されて、見ていて飽きないものができます。
このカットとカットの間に挿入される効果のことを「トランジション」といいます。
カットとカットが重なって徐々に変化するディゾルブ、次のカットがせり出してきて重なるような効果のワイプ、暗転してカット間をつなぐフェイド、すべてトランジションです。

忘れてはならないのが、トランジションは “切替” の効果だということです。
意味・場所・時間・心情などに大きな変化（切替）がないカット間のつなぎには通常、トランジションは使いません。

漫才では、場面や人が変わったなど「転換」を表現するために話者がくるっと一回転することがあります。

ダイノジというコンビが昔やっていたネタではこれを逆手に取り、くるっと一回転して何も変わっていない、というものがありました。
大きな変化のないカットをトランジションでつなぐ事は、一回転して何も変わっていない漫才のネタと同じです。

iPhoneに入っている動画編集ソフトiMovieは、複数のクリップを選択していざ編集を始めると、カット間には既にトランジション（ディゾルブ）が挿入されています。
単にカットをつなぐより、ぼやーっとフェイドアウトしてぼやーっとフェイドインする方が「なんか動画の編集っぽい！」というのはよくわかります。

家族の思い出をみんなでわいわい振り返る短い動画ならいいですが、映画のようにある程度の尺があり、ストーリーや心情など、伝えたいことがある動画に意味のないトランジションが多用されると内容に集中できなくなります。

動画で何かを伝えようとする時は「意味のないトランジションは入れない」事を意識するだけで、ずいぶん見やすい動画になるので試してみてください。

余談ではありますが、イギリスBBCが制作したテレビドラマSHERLOCK（シャーロック）のトランジションがすごくおしゃれでした。
こちらをご覧ください。
https://www.youtube.com/watch?v=1IDBZ5AsUuk

現在新型コロナウイルスが世界中で猛威を奮っています。

世界保健機関（WHO）も国際緊急事態を宣言し、日本でも感染者が確認されました。まだまだ被害が拡大していくことが懸念されています。手洗いうがいを念入りに行なったり、マスクをつけたり、一人ひとりが感染を予防するために最善の対応をしなければなりません。

そんななか、全国各地のドラッグストアやスーパーなどからマスクが姿を消して話題となっています。

大阪からマスクが消えた。世紀末かよ pic.twitter.com/2MzbZuLlAj

— JIN 27 (@JINKAWAGUCHI_) January 30, 2020

私の住む田舎町でもマスクがない

新型コロナ予防じゃなくて、
花粉症の娘にさせるマスクがない#マスク売り切れ pic.twitter.com/6tGEBwPMFu

— にゃんこまんま (@hachiwarenototo) February 1, 2020

感染を防ぐためにマスクを買い込んでおくのは予防のために必要な行動ですが、マスクを買えない人が出てくるような状態になるのはある意味自分の首を絞めるような行動となってしまうでしょう。

古くは1973年のオイルショックでトイレットペーパーの買い占めが問題となったように、日本では過剰な買い置きがたびたび問題となってきました。ところが今回はマスクを大量に買い込みをしている人のなかにネットで転売することを目的にしている人も多くいるというのですから驚きです。

マスクなんかを転売して儲けになるのでしょうか。実際にフリマアプリのメルカリを検索してみると、いつもドラッグストアで見かけるようなマスクが本当に超高額で取引されていました。

普段なら一箱数百円で買える商品が数千円で販売されています。

こちらは100円ショップのダイソーで販売されているマスクなので普段なら税込110円で購入できますが、メルカリでは約2,000円で落札されていました。なんと10倍近い価格で売れています。

これだけ高額になっても購入する人がいるということは、それだけマスクを必要としている人がいるということ。マスクの生産が追いつくようになるまでは当分この状況が続くことでしょう。

スマートフォンやネット決済の普及、さらにメルカリを代表とするフリマアプリの登場によって、誰でも簡単に物を売ることができるようになりましたが、このように日用品を転売する人もかなり増えているように感じます。

100円ショップのマスクを10倍の価格で売れるのなら私もやろうかな……なんて考えてしまう人もいるかもしれませんが、絶対ダメ！
メルカリの規約では「通常の経済的価値と著しくかい離した販売価格により商品を出品すること」は不適切行為として禁止されています。

削除されている例も出てきているようですので、どんなにマスクが必要な場合もこれらの商品は購入せず、あまりにひどい場合はメルカリの事務局に通報することも大切です。

こんにちは山形のWEBデザイナー菅野です。

ご存知の方も多いかもしれませんが
WEBページのほとんどは HTMLタグを使って書かれた文書です。
それをブラウザを通してみることでWEBページとして見ることができます。

ブラウザによってやり方は違いますが、実際にWEBページのソースを開いてみると

こんな感じで 英語の文字列になっており
ソースコードと呼ばれたりもします

HTMLを書いていくことをコーディングといい
仕様書やフローチャートに沿ってソースコードを記述していきます。

地道な作業でページを仕上げていくまでには
結構な時間と労力を使います
私の場合はコーディングが苦手なので特にそう感じるのかもしれません💦

何も知らない方からすれば、ソースコードと戯れてる姿は
プログラミングに見えるんじゃないですかね
それぐらい渋めの作業です（笑）

HTMLのタグは それぞれ役割を持っており
例えば見出しは h1〜h6の6種類のタグで 重要性の違いを示すことができます
また、<header>や<footer>などは要素を伝えるの役割を持っています

タグのつけ方がグーグルの検索結果にも影響するのでとても重要な作業になります

これらのことから
しっかりと書かれたWEBページであれば、ソースコードを見ることで
そのページの全体構造が見えてきて、何が重要なのか 何が言いたいのかが見えてくるわけですね

これって 個人的にはデザインと似ていると感じる部分です

ポスターやチラシなど 紙媒体のデザインの場合も
やはり、このデザインにおいて「何を伝えるか」を考えます
重要な情報は大きくしたり、色をつけて強調したり
関連性のある情報を隣接させて分かりやすいレイアウトにしたりなど
内部的な骨組みを考えながらデザインするので
HTMLを書く作業と非常に似ているな〜と感じます

デザインの場合は、タグのように明確なものはありませんが
いいデザインは、内部的な骨組みがしっかりとしたものが多いように思いますので
私も、見た目だけじゃなく、中身のあるデザインを心がけたいところです。

HTMLのコーディングは、しっかり書かれていなくても表面上はわからない部分です。
かといって、余り適当に書いてると、デザイン関係なしのゴリゴリのコーダーに
キツめのツッコミを入れられます（笑）

YouTubeで検索した時、見る動画をどうやって選びますか？

もちろん、タイトルや説明文にも目を通すでしょうが、ずらり並んだサムネイルの引力は大きいはずです。
つまり、動画の内容がどうこう言う前に、サムネイルを見て興味を持たれるかどうかが決まってしまうということ。

↓サムネイルは灰色の部分。

サムネイルは、例えるなら書籍の表紙、お菓子のパッケージ、営業マンの顔・・・。

サムネイルの目的はただ一つ、「選んでもらう」こと。
動画が始まったら、そのサムネイルをもう見ることはありません。

YouTubeに動画をアップロードすると、自動的にサムネイルが表示されます。
動画の中の一コマが使われるんですね。

しかし、もっと「選ばれる」ことを考えるなら、こういう受け身ではダメ。
サムネイルは別途作成し、それをアップロードしましょう。

↓アップロードできる部分

今回は、僕なりの＜戦略的サムネイル論＞について、特に一般的な企業での使用を念頭にまとめてみたいと思います。

＊　＊

サムネイルは次の３つの要素を考える必要があります。

【１】画像の選定
【２】文字の記入
【３】画像と文字の組み合わせ

それぞれ見ていきます。

【１】画像の選定

小さくてもパッと伝わる画像を選ぶ

一度、パソコンのサムネイルのサイズを見てみてください。
横３センチ×縦２センチくらい。
スマホならさらに小さく、横２.５cm×縦１.５cmほど。

つまり、皆さんの作るサムネイルは、人の目に触れるときはとっても小さい。

だからサムネイルは、このサイズで伝わるかどうか？を意識した画像選びが必要なんです。

例）野球場の動画

出典：ぱくたそ

左の写真には河原の野球場が写ってます。「これは確かに野球場なんだ」と主張することもできるでしょう。
しかし、右の写真の方が一瞬で伝わります。

正しいかどうかではなく、「パッと伝わるかどうか」で選びましょう。

分かりやすさは、サムネイルの目的に大きく影響します。
何の動画なのか、何についての動画なのか、がすぐ分かる画像を使うといいでしょう。

候補が複数あるなら、「どちらがよりパッと伝わるか？」で選びましょう。

人が登場すると個性的になる

今は、単にきれいなだけの画像だと選ばれません。誰もが見慣れているからです。
ん？と手を止めてもらうためには、画像に個性や引っ掛かりが必要です。

そのためには、人が登場するのも一つの方法です。

サムネイルに顔出し、と言えばユーチューバー。

全体的に顔がアップ。
好みの問題はあると思いますが、今はこれが気を引くスタイルなのでしょう。

しかし、です。
企業で動画を作るときは、あまり突飛なものは好まれない。
僕自身、自分でこんなサムネイルを作るかというと、抵抗があります・・。

そこで、サムネイルに人を入れる場合にオススメなのは、顔のアップではなく上半身を入れること。
出る方も素人でしょうから、こちらの方が抵抗感も少ないはずです。

特定の職業や内容を伝える場合は、制服を着用したり、工事ヘルメットをかぶったり、特殊な工具を持ったりして写るといいでしょう。

情報量が多いサムネイル画像はNG

一方で、全身写真はどうでしょうか。

使い方として悪くはないのですが、写真撮影に慣れてない企業にはあまりオススメしません。

顔が小さくなるため、よほど特徴的な外見でない限り、せっかく人が出る良さが軽減します。
それに、全身を撮ろうとすると、人物の周りのあれこれが写り込んできて、ごちゃごちゃした写真になってしまうかもしれない。

広い範囲を撮り、ごちゃごちゃしてるサムネイルをよく見かけます。
パッと見て分からなくなるので、情報量が多いサムネイル画像は使い方に注意です。

【２】文字の記入

まず文字サイズを決める

文字については考えることがたくさんあります。
内容・フォント・サイズ・デザインなど。

この中で最初に考えるべきは、やはり文字サイズです。

サムネイルの状態で見ると、どれがいいでしょうか。
つい、動画の中のテロップなら、②とか③くらいのサイズでもいいですが、サムネイルだと①くらいが無難。
④はややデザインセンスが問われますし、企業イメージとの整合性を考えなきゃいけません。

文字サイズが決まると、文字数にもある程度制限ができます。
この制限の中で表現する内容を考えましょう。

先に何を書くかを考え出すと、文字数が溢れかえります。
サムネイルはカタログではありません。
必要なことをあれもこれも書こう、というのは違う。

大事なので再び繰り返します。
サムネイルの目的は「選んでもらう」こと。
正確で豊富な情報を伝えることではないんです。

また、これも画像と同じく、サムネイル画像を作成する段階では、「え・・ちょっとフォント大きすぎない？」と感じてしまうもの。

そこで文字を小さくしちゃわないよう、作る前にフォントサイズを決めておくといいでしょう。

【３】画像と文字の組み合わせ

サムネイルは、画像と文字の組み合わせでできています。
やり方に答えはありませんが、僕の独断で＜無難な３パターン＞をご紹介します。

A：白地（明るい背景）に濃い文字

文字も読みやすく、情報を伝えるのに向いているでしょう。
オフィス内などの写真を使う場合も、できる限り明るく清潔感を持って撮るといいでしょう。

B：濃い写真に白い文字

地域や自治体のPR動画に多い気がします。
文字が印象的に伝わるため、おしゃれで、イメージを伝えるのに向いているでしょう。

C：画像と文字を分ける

写真の上に文字をかぶせると、どうしても文字が読みづらくなるリスクを伴います。
デザインで回避する方法はいくつもありますが、そもそも分けてしまうという方法がこちらです。
もちろん人物の部分は、景色でも製品でも構いません。

サムネイルは「選ばれるためにある」

今回の内容は、単純に「こうすべき」とは言えない部分は大きいです。
一つの参考にしていただき、皆さんそれぞれ考えを巡らせていただければ幸いです。

ただ、サムネイルは「選ばれるためにある」ということだけは意識した方がいいと思うんです。

そのため、
・サムネイルをどんな雰囲気で見せるか決めておく。
・パッと伝わる写真を選ぶ。
・少しでも文字が読みやすいよう工夫する。

この３つくらいは社内で共有しておくといいのではないかと思っています。

世界のwebサイトの35%、CMSが使われているwebサイトの60%以上のシェアを持つWordPress。
数字が示す通り、弊社でもCMSを入れる≒WordPressを導入する、というパターンがほとんど。約1年前にバージョン5.0がリリースされた時に、新しくGutenberg（グーテンベルク）というエディターが導入されました。web制作業界ではかなり話題になったのですが、実際のところ、まだ手探りしながら導入を進めている制作会社もあるのではないでしょうか。なぜかというと、それまでのエディターと大きく仕様が変わったからです。

クラシックエディターと呼ばれているこれまでのエディターは、テキストを入力する欄は1ヶ所で、入力したテキストに対して、Microsoft Wordのように書式を設定していく形でした。

対して、Gutenbergはこんな感じです。

Gutenbergは、見出しや本文テキスト、画像など、予め書式が決まったブロックを追加していく形。日常使うようなアプリやサイトにないタイプのUIなので、一見とっつきづらいのですが、LEGOブロックを組み立てていくような感覚で記事を書ける、と言えば何となく伝わるでしょうか。

デメリットは、パーツが予め決められている=フォーマットに沿った形でしか構成できない、という点で、html・CSSが分かる方やクラシックエディターに慣れた方だと、融通がきかないと感じると思います。

そういうこともあって、弊社の事例ではこのGutenbergを利用しているサイトはわずかに2サイトのみで、クラシックエディターを選択するケースがほとんどです。

現状のWordPressはクラシックエディターに切り替えられる使えるので問題ないのですが、クラシックエディターが廃止となり、Gutenbergを使わないといけない、となったらかなり混乱が起こるはずなので、Gutenbergにいつでも移行できる準備をしておこうと思っています。

「宅ふぁいる便」はメールに添付できないサイズのファイルを送るのに便利なファイル転送サービスのひとつでしたが、2019年1月に不正アクセスによる大規模な情報漏えいが発生し、以来ずっとサービスを停止していました。

宅ふぁいる便の情報漏えいがヤバい！ 会員登録していた人はパスワードの変更を！
http://wepress.web-magazine.jp/2019/02/04/takufilebinnrouei/

宅ふぁいる便ではサービス停止中に原因や被害状況の調査、セキュリティの点検、さらなる利便性の向上について検討を重ねてきたそうですが、安心して使えるサービスを提供するためには相当程度のシステム構築が必要なことが判明。再構築に要する時間や費用を踏まえて総合的に判断した結果、なんとそのままサービス終了することが決まったようです。

「宅ふぁいる便」サービス終了のお知らせ
https://www.filesend.to/

情報漏えいが判明したときもそうでしたが、いったいどれだけ古い環境をアップデートしないまま使い続けていたんだろうと思ってしまいますよね。宅ふぁいる便がサービスを開始したのは1999年のこと。国内のファイル転送サービスのまさに草分け的な存在だったのですが、目まぐるしく環境が進化し続けているインターネットにおいては必ずしも「老舗＝安心」とはならないと気付かされる一件でした。

今後使うべきファイル転送サービスは？

ここからは個人の見解となりますが、以前私は「Firestorage（ファイアーストレージ）」というサービスを最もよく利用していました。特にこだわりはありませんでしたが、操作が簡単で、やっぱり昔からよく聞くサービスということで安心感を持っていました。

ところが近年はホームページをSSL化させることが当たり前となりつつあるなか、FirestorageはいまだにSSL化されていません。有料会員になればSSL通信でファイルを送ることができますが、ほかの無料ファイル転送サービスがSSL化されているなかでFirestorageで有料会員になる選択肢は考えにくいですよね。

私が現在最も利用しているのは「ギガファイル便」です。こちらは最大200GBまでのファイルを無料かつSSL通信で転送できるので、基本的にはこちらを使っていれば問題ないと思っています。

ただ、つい先日にTwitterでギガファイル便のサービス規約などがずさんなことを指摘するユーザーが現れ、ギガファイル便の公式アカウントが謝罪をするという一件もありました。

ギガファイル便というサービス、

・アップロードしたファイルの取り扱いについて規約がない（もうこの時点でアウトだと思うが）

・運営会社は代表取締役の氏名なし（かなり黒い）

・住所と電話番号の地域が合ってないし電話番号は別名義会社（アウトじゃね？）

使わないほうがいいと思うけど。 pic.twitter.com/L9aj063I5z

— 未識魚 /中川譲＠C97 30日西Ｇ33b (@mishiki) January 19, 2020

現在、お騒がせしている件について
弊社は技術者のみの会社(事務が一人)で、いろいろと手が回っていない部分もあり
この度は、皆様に不安を抱かせてしまい大変申し訳ありません。

現在、プライバシーポリシー・利用規約を修正中ですので近日中に改めて公開いたします。

— ギガファイル便 (@GigaFile_TV) January 20, 2020

運営会社の情報が正確でなく、サイトに掲載されている規約を読む限りではアップロードしたファイルを内部の人が閲覧しないと言い切っていないという指摘に対し、公式アカウントでは「事務が一人しかいないため手が回っていなかった」「近日中に対応する」と弁明しています。

これが事実だとしても、事務が一人しかいない規模の会社が運営しているサービスに情報漏えいしたら困るファイルをアップロードするのはちょっと怖いな……と感じてしまいますよね。

そのため、誰かにある程度重要なファイルを送りたい場合はファイル転送サービスではなく、DropboxやGoogle Drive、iCloudなどのストレージサービスを使って共有するようにしています。ちょっと面倒に感じる人が多いかもしれませんが、やっぱりAppleやGoogleなどの大きな会社が提供しているサービスなら安心なのです。

旅の思い出は上手に残したいですよね。

スマホで写真や動画はいっぱい撮ると思います。
「これぞ」という何枚かはSNSに投稿したりするでしょう。

しかし、大量の写真や動画を何度も見返しはしないし、それらを関係者全員で共有するのはさらにややこしい。

そこで、旅の思い出を２、３分の動画にまとめてしまおう、というご提案とその方法です。

先日、３家族で２泊３日の沖縄旅行に行きました。
２歳から７０代まで１０人という大所帯。

この旅行の様子を旅行中に２分ほどの動画にまとめ、スマホで共有したところ、大変好評でした。
※なお、プライバシーの関係で動画そのものはお見せできません・・。ご了承ください！

アプリQuikの自動編集がカンタン！

まず、最終工程の「編集」から。
スマホアプリQuikの自動編集機能を使いました。
旅先動画なので、素早さも重要です。今回は旅行中に５分ほどで完成させました。

【パッと見せるPR動画】ならば、自動編集に任せてしまってもいいでしょう。
Quikの自動編集機能はすばらしく、例えば、撮影カットの中から、人物が手を振ってる部分だけピックアップされたりします。

自動編集フローはこんな感じ。

①アプリを起動し、「フラッシュバック」の青いボタンをタップ
※このまま完成として⑥へ進んでもよし。
②デザインを選択・変更
③音楽を選択・変更

④いらないカットを削除したり長いカットを短くしたり
⑤全体の長さなどを調整
⑥保存ボタンをタップして完成

撮影機材は結局シンプルイズベスト！

できる限りいろんな撮影がしたかったので、僕なりの選抜メンバーを持っていきました。

 

で、結果的に、ほぼこれだけしか使いませんでした。
スマホをハンドルにつけただけの状態です。

ハンドルはとても重宝しました。旅行中、最後まで付けっ放しだったくらい。
スマホだけを持つよりはるかに安定します。

 

そもそも、「気に入った場所でじっくり好きなように撮影を続ける」なんてのは限られた人だけ。

現実の旅先では、「ちょっとー！行くよー！」と急き立てられながらの撮影になるわけです。
当たり前ですが、メインは旅行であり、撮影はサブです。

途中までワイドレンズもつけてましたが、レンズキャップをつけたり外したりが面倒で使わなくなりました。レンズはすごくいいんですが、むき出しでカバンにつっこめない。

そもそも、旅先では両手がガラ空き、なんてことはありません。
上着を脱いでたり、おみやげ袋を下げてたり、パンフレットを持ってたり。
だからスマホの動画撮影は、「片手で操作」ができると大変便利。

また、子供達も突然走り出したりするので、ジンバルも使いませんでした。
とっさの撮影には向きません。

いい素材をたくさん撮ることが大事！

あとはもう「いい素材」をどんどん撮るだけです。

ただここで言う「いい素材」とは美しく撮ることばかりではありません。
例えばこちら。

きれいだとは思いますが、僕的にはつまらない。
美ら海水族館に行ったら１００％誰もが撮る写真だし、誰でもきれいに撮れる。

また、旅先では「サッと撮ってパッと去る」がマナーだと思います。
だとしたら、「さあてどこから撮るといいかなあ」なんて考えてるようではいい素材は狙えません。

そこで、これは誰にでも使えると思った撮り方を１０パターンご紹介しておきます。

【１】誰でも撮る場所は、違うアングルを探す

先ほどの美ら海水族館では、魚を見上げる子供達の顔を撮りました。
周りを見ましたが、大人たちもいい顔をしてましたよ。

【２】スマホは意図を持って動かす

上の例は、下から上に動かして空間の広さを表現しました。
下の例は、右から左に動かして指差す方向の景色を撮ったものです。

【３】景色には人を入れて撮る

展望台とか景色のきれいな場所では、ただ景色だけを撮るのではなく、一緒に行った人たちを入れて撮りましょう。
記念写真を撮ってる様子を撮る、というのも鉄板です。

【４】カメラマンが一緒に歩いて撮る

上の例は、いろんな歩く人を撮ったもの。
下の例は、走っていく幼児を後ろから追いかけて撮ったもの。
少し視点を下げて撮るといいですね。犬を連れてる時にも。

 

 

注意点は、脇を締めて、できる限り揺れないように気を配ることです。

【５】一人一人の顔を撮る

【４】ではカメラマンが一緒に歩きましたが、こちらはカメラマンは立ったまま。
カメラの脇を人々が通り過ぎていく様子を撮ることで、一人一人の表情を押さえられます。

【６】看板の文字と一緒に撮る

建物だけ看板だけを撮るのではなく、撮った後に一緒に行ったメンバーにカメラをゆっくり向ける。
行った場所と雰囲気を一緒におさめられる便利な撮り方です。

【７】変化がない景色は、アップも合わせて撮っておく

森とか崖とか、変化が少ない光景だってあります。人と一緒に撮れないこともあるでしょう。
そんな場合は、引きと寄り、両方の映像を撮っておきましょう。
アップにするとちょっと変化が現れます。

【８】食べ物は鉄板！

食べ物の写真や動画は必ず撮ります。
景色と同じですが、ただ食べ物だけ撮るのではなく、人も入れましょう。
美味しいものを食べてる時は、大人も子供もいい表情をします。

【９】素の表情を狙う

撮られてることを意識しない表情もおさえましょう。
今回よかったのは、エレベーターが開く前から待ち構えて撮った、開いた瞬間の動画です。
（我々しかいなかったのでできたことですが）
メインの観光地ではなく、休憩場所とか気が抜けた瞬間が撮影チャンスです。

【１０】つなぎの映像も忘れずに！

旅行は移動がつきもの。どう移動したか、も必ず撮りましょう。
電車移動なら窓の外の光景、車移動なら車の中からの光景、街の様子など。
これらの映像を挟むことで、移動している様子が伝わり、旅行感のある動画になります。

 

以上、１０種類の撮り方をご紹介しました。

「どう撮るか」を事前に頭に入れておくことで、撮ることばかりに集中するのではなく、撮ってる皆さん自身も旅行を楽しめるようになりますよ！

 

「グローバルナビゲーション」とは、原則としてWebサイトのすべてのページに共通で表示させる、主要ページへのリンク集のことをいいます。
「グロナビ」「グローバルナビ」などと略されることもあります。

詳しく知りたい方は以下をご覧ください。

目次

グローバルナビゲーションとは？
他のサイトでの説明
復習クイズ

 

●グローバルナビゲーションとは？

Webサイトのどの部分がグローバルナビゲーションなのか、まずは当サイト「wePRESS」を例にして説明しましょう。

当サイトをPCで表示させると、どのページを開いてもページ上部にこの画像の赤枠で囲んでいるメニューが表示されますよね。こちらがグローバルナビゲーションです。

スマートフォンで表示させるとサイトの上部に三本線のメニューボタンが表示されます。こちらをタップした際に表示されるメニューがグローバルナビゲーションです。スマートフォン版では3本線のメニューボタンがハンバーガーのように見えることから「ハンバーガーメニュー」とも呼ばれています。

当サイトではグローバルナビゲーションをページ上部に表示させていますが、サイトのデザインに合わせてサイドバーやページの下部に表示させることもあります。

ただし、グローバルナビゲーションはサイト全体の構造や主要コンテンツをユーザーがすぐに視認することができ、どのページにいても主要コンテンツにすぐアクセスできるようにして利便性を高めることが設置する大きな目的です。

デザインをする場合は使いやすさ・見やすさを最優先にして作り込まなければならないでしょう。

 

●他のサイトでの説明

グローバルナビとは｜SEO用語（意味・説明・SEO効果） | プロモニスタ
https://promonista.com/glossary/globalnavi/
用語の解説から作成する際のポイントまで書かれています。

タイプ別！グローバルメニューのデザイン15選。本当に参考になるものだけ厳選 | Web幹事
https://web-kanji.com/posts/globalmenu-design
グローバルナビゲーションの優れたデザインを紹介しているサイトです。

グローバルナビゲーションとは？グロバルナビゲーションの役割とポイントについて | SEO用語集：意味/解説/SEO効果など [SEO HACKS]
https://www.seohacks.net/basic/terms/global-navigation/
覚えやすいグローバルナビゲーションの例も紹介されています。

 

●復習クイズ

説明がわかりづらい、間違っているなど御指摘ありましたらお問い合わせよりご連絡いただけると幸いです。

 

まずはこちらの画像をご覧ください。

こちらは世界で最も有名なウェブページかもしれませんね。言わずと知れたGoogleのトップページです。余計な情報は一切なく、中央に検索窓があるだけ。シンプルさと使いやすさを追求したデザインです。

でもよく見ると、おそらくほとんどの人が使ったことのないボタンが設置されています。

「Google検索」のボタンの右側に「I’m Feeling Lucky」というボタンがありますね。実はこれもGoogleの検索方法のひとつなのです。

直訳すると「私は運がいいと感じる」というような意味になりますが、ではどんな検索ができるのかと考えると逆にわからなくなってしまうようなネーミングですよね。

「I’m Feeling Lucky」検索の使い方ですが、検索ワードを入力したあとにEnterキーや「Google検索」のボタンを押すのではなく、かわりに「I’m Feeling Lucky」を押すと、検索結果一覧ページを飛ばして検索結果の一番上に表示されるページをいきなり開くことができるのです。

試しにこのサイト「wePRESS」を検索ワードにして「I’m Feeling Lucky」検索をしてみましょう。

すぐにwePRESSのトップページを開くことに成功しました。急いで有名なサイトを探す場合や、ほかに同じ名前のサイトがない場合には便利かもしれませんね。ただし検索結果は常に変動するものなので、「wePRESS」で検索しても別のサイトが開く可能性もあります。運試しのような要素もあるので「I’m Feeling Lucky」というネーミングなのかもしれませんね。

便利なのかと問われてもいまいち便利とは言い切れないような「I’m Feeling Lucky」検索。どうやら2007年の時点でもユーザーの1％しかこの検索を使っていなかったというデータがあり、ライト層のネットユーザーがどんどん増えている現在ではその数字はさらに下がっているのではないでしょうか。

ちなみに検索窓に何も入力していない状態で「I’m Feeling Lucky」ボタンを押すと、世界各国の祝日や記念日などに合わせてGoogleのロゴマークをアレンジしたDoodle（ドゥードゥル）のアーカイブなどを見ることができますよ。

 

Googleがレスポンシブデザインを推奨し始めて以降、webサイトを作るときにスマホ対応をするのが当たり前になりました。このときに同時に「ハンバーガーメニュー」ボタンも普及しましたね。リストをアイコン化した三本の線が、バンズとそれに挟まれたパティのように見えることからこの名前がつきました。

そして、ハンバーガーメニューは、ヘッダーの右上もしくは左上に配置されることが多いのはみなさんもご存知の通り。 しかしここ1年ほどで、webサイトの下側にメニューを置くサイトが少しずつ増えているような気がしています。

biblle ※タブコード制作事例
https://www.biblle.net/

さくら製作所
https://sakura-wks.com/

 

illuminate
https://illuminate-pjt.com/

SONICJAM
https://www.sonicjam.co.jp/
※真ん中の「…」を左右どちらにドラッグしてメニューが表示される仕様

なぜこのようなメニューが登場してきたかと言うと、これはひとえに「ディスプレイの縦長化」です。具体的には、iPhone X。それまでのスマホよりも、より縦長になりヘッダーが表示されるエリアに親指が届かなくなりました。

web制作に携わっている人ならきっと見たことがあるであろう、親指が届く範囲を示したこういう図があります。

歴代iPhoneの主要サイズと有効タッチエリアの比較図。(つくった) pic.twitter.com/PoJ6WEQqEN

— Go Ando / THE GUILD (@goando) November 2, 2018

見ての通り、iPhone Xから画面上部に明らかに上に届かない大きさになりました。

webサイトよりもトレンドの移り変わりが速く、操作性がより重視されるネイティブアプリの場合は、基本的に画面の下側にメニューが置かれていることが多いですよね。webサイトの場合は、メニューをタップするのはそのページのコンテンツを一通り閲覧して別のページに移る時などです。そこまで頻度が高くないため、まだ上側でも許容できるのだと思います。

僕はiPhone Xを使っているのですが、さすがにブラウザ上端にあるメニューボタンは押しづらいですし、上記のようなメニューが下側にあるサイトを見たとき、操作のしやすさに少し感動しました。右左どっち側に置くか、という問題はありますが、ディスプレイが大きくなればなるほど、この流れが加速するのではないかと予想しています。

あるステージイベントのライブ配信をお手伝いしたときのことを書きます。
専用機材や専門スタッフに頼らず費用をかけずにやってみようということで、プラットホーム選びから実施までを担当したのです。

ツイキャスを試してみよう

まず「ライブ配信といえばツイキャス」というのは、皆さんも先ず頭に浮かぶのではないでしょうか。
ツイキャスは「ツイッター・キャスティング」の略で、Twitterが提供するサービスだと間違って思い込んでいて、Twitterとは無関係の日本企業が提供するサービスとこの時に知りました。

高品質の配信を目的とせず、とにかく手軽に配信できるサービスが人気で、世界中に2,500万人以上のユーザーがいます。
試しに社内のワークショップをライブ配信してみたところ、本当に手軽に配信することができました。

ツイキャスは制限時間が

しかしツイキャスの配信には30分という時間制限があり、そこで一旦ライブ終了。
ただしコンティニューコイン（視聴者から配信者に贈られる配信時間を延長するアイテム）が一定数以上集まると、最大4時間まで連続して配信することができます。
30分で終了しても再度ライブボタンを押すことで続けてライブ配信が可能ですが、1時間以上あるイベントを途切らせたくなかったのでツイキャスは断念しました。

Twitterを試してみよう

Twitterでもライブ配信ができます。”ライブ放送”と呼ぶみたいです。
やり方も簡単、ツイート作成画面でカメラのアイコンをタップし、選択画面下部にある [ライブ] モードをタップするだけ。
Twitterアカウントさえあれば誰でもライブ配信ができます。

知名度が心配

以前はPerispece（ペリスコープ）というアプリをインストールしないと配信も視聴できませんでした。
この連携の悪さが、ツイッターのライブ配信プラットフォームとしての知名度が広まらなかった原因かもしれません。知名度に心配があって、Twitterも断念しました。

YouTube Liveを試してみよう

YouTubeLiveは、世界最大の動画サイトYouTubeの提供するプラットフォームなので、知名度は抜群。
ライブ配信もYouTube公式アプリを使用して簡単に行えるし、ツイキャスのような時間制限もありません。

これにも制限が…

デスクトップ端末からの配信に制限がありませんが、モバイル用公式アプリの使用に制限がありました。
公式アプリでスマートフォンからライブ配信するには、YouTubeのチャンネル登録者数が 1,000人以上である必要があります。
嵐でもEXILEでもない僕らには、急に登録者1,000人を集める自信がありません。
この制限には、ヘイトスピーチや犯罪に利用されないように、というYouTube側の配慮があるようです。

YouTubeLiveの制限を回避して実施

この制限が適用されるのは「公式アプリを使ったモバイルからの配信」だけであり、その他の配信ツール（アプリ）を使用することで、
スマートフォンからの配信でもこの制限を回避することができます。
イベント会場にデスクトップ端末を用意するより、その他の配信ツールを試してみる方がお手軽でした。

streamlabs

で、今回はstreamlabs（ストリームラボ）というソフトを使用しました。https://streamlabs.com/slobs/d/2223777
日本語化されていない英語のソフトですが、直観的に操作できるので、使い方はそんなに難しくありません。

イベント当日

そしてイベント当日。
streamlabsアプリをインストールしたスマートフォンから、YouTubeLiveを使ってなんとか無事（？）に配信することができました。

ポケットWiFiを用意して臨みましたが、イベントが行われたホール内の電波状況が非常に悪くて、開始から15分ほど遅れた配信になってしまいました。
動画配信で大量のデータを扱うので、ポケットWiFiの電池の減りが異様に早く、イベントの終了が先か電池の終了が先か冷や汗ものでした。

他のプラットフォームもある

今回試した他にも、facebookliveやニコニコ生放送、LINELIVE、FRESH!（AbemaTV）などが利用できます。
それぞれ使い勝手や制限、ユーザー層にも違いがあるので、ライブ配信の目的や手段によってプラットフォームを選びたいものです。

〇感想「制限は現実世界に」

ライブ配信は簡単に行えますが、機材や会場の電波状況などの物理的な制限は現実世界にあります。
「ちゃんとやろうと思ったらそれなりの準備が必須なので簡単とも言えない」というのが僕の感想です。

先日、友人から「急いで原稿用紙100枚分くらいを書き起こしたいけど、パソコンは持っていないし、スマホで文字を打つのも苦手だ。どうしようか……」と相談を受けました。一般的に原稿用紙1枚とは400文字のこと。パソコンも使わず4万文字の原稿を仕上げるなんて、かなり無茶な話です。

友人は、手記を出版する予定で、インタビュー的なことをしてもらって文字起こしまでを頼める人を紹介してほしいというつもりらしかったのですが、お金も全然ないとのこと。

でもきっちりとまとめた原稿ではなく、考えていることを文字にすることさえできればいいということがわかったので、僕は、以前の記事でも紹介しましたが「Googleドキュメント」を使って音声入力する方法を提案しました。
僕も久しぶりに試してみましたが、以前よりも精度が上がっているように感じました。

 

「Googleドキュメント」のスマホアプリ

上の画像は「Googleドキュメント」のスマホアプリを使って音声入力をしている画像なのですが、マイクに向かって喋った言葉を、内容に合わせて的確な漢字を使いながら即座に文字に起こししてくれます。

また、以前に使用したときには気づかなかったのですが「かいぎょう」と話しかけると改行を入れてくれますし、「かっこ・かっことじ」と話せば括弧をつけることもできます。

 

上の画像も音声入力をした画像ですが、しっかり「開業」と「改行」の区別がついていますし、「かっこいい」「かっこ」「かっことじ」も見事に使い分けてくれました。

そしてアプリで作ったGoogleドキュメントのファイルはWordファイルやPDFに変換してそのままメールなどで送ることも可能です。

 

友人はこの方法を使って無事に原稿を作ることができたそうです。しかも数日で済ませられ、お金も一切かけずに済んだと喜んでいました。役に立ててよかったです。友人が出版社に持ち込む企画が通るかどうかはわかりませんが（笑）

実はこの方法、一気に音声入力をしてから手入力で文章を整えると作業がものすごく効率化されのでプロライターの中にも愛用している人が増えているようです。

パソコンは使えないけど話すことはできるというシーンでも使えますね。
防水対策をすればお風呂に浸かりながら原稿作成なんてこともできそうです。
機会があればぜひご活用ください。

みなさん明けましておめでとうございます
山形のWEBデザイナーの菅野です。

今年も色々な方から年賀状をいただきましたが
私がデザインさせていただいた年賀状も 何点か届きました（^ ^）

データで納めてクライアント側で印刷してもらう場合が多いので
データでチェックはしているものの
届いた年賀状で出来上がりを確認して一安心です

いただいた年賀状を眺めていると
たかが年賀状、されど年賀状といったところでしょうか
目に止まるものと、そうではないものに気付きます

今回いただいた年賀状で 一番良かったと思うものが上の写真です

これは、仕事で繋がりのある
撮影事務所のスタッフさんから年賀状です

ネズミの着ぐるみを着て撮っただけのシンプルな年賀状ですが
なんとも言えないシュールさと
モデル本人のことを知っているからかもしれませんが
見てるとクスっと笑えてくる一枚です
ちなみにモデルさんは女性の方です

写真自体のクオリティが高いのでおもしろいんですよね
普通に撮った写真だとつまらないと思います
さすが撮影のプロといったところです👍

またその他では
年賀状自体はご紹介することはできないのですが
今年 W杯の日本開催でブームになったラグビーをテーマに
社員全員が ニュージーランド代表 オールブラックスの踊り
「ハカ（Haka）」のポーズを取り
ONE TEAMとなってお客様の満足にトライ（挑戦）します
という内容の年賀状もありました😅

こちらは見た目のクオリティというよりは
アイディアによる面白さとインパクトがあるなと思いました👍

このような限られた小さなスペースでも差が生まれるわけですから
年賀状に限らず
印象に残るデザイン・クリエイティブで
今年もクライアントのお役に立てるようにがんばりたいと思います💪

wePRESSをご覧の皆さま、あけましておめでとうございます。

早いもので今年は2020年。ミレニアムだとか、20世紀から21世紀に変わるとか騒いでいた2000年のお正月から20年も経ったと思うと感慨深いものがあります。

さて、そんな20年前の話ですが「2000年問題」という問題が世間を騒がせたことを覚えてますでしょうか。

2000年問題とは西暦が1999年から2000年に変わる際にコンピュータが2000年であることを正常に認識できなくなり、予期せぬトラブルが起こる可能性があるとされた問題のことで、1990年代末期に使用していたコンピュータプログラムの訂正が世界規模で行われました。

その結果として大きなトラブルは起こらずずに済んだのですが、その2000年問題の再来ともいえる事態が2020年になった瞬間に、一部のガラケーユーザーの間で起きていたようです。

2020年に来れなかったガラケーたち
https://twitter.com/i/events/1212738202974351360

目覚ましが作動しなかったので、おっかしいなぁ～っと携帯見たら目覚ましどころじゃなかったｗ
2020年を迎えることが出来なかったっぽいｗ pic.twitter.com/uIdUJrLDoA

— IG (@aosingou) December 31, 2019

えっ……2020年になってからガラケーがバグって、カレンダー2000年になって時間止まったんだけど……。
姉ちゃんのガラケーも他のやつもみんな止まってるし、ガラケーって2020年に行けないのか！！？？ pic.twitter.com/bbRwsQWFgr

— テンコ＠単行本出ました！ (@H_Tenko) January 1, 2020

リンク先で紹介されているガラケー端末は2020年に変わった瞬間に一斉にエラーを起こし、時計が止まり、アラーム機能が使えなくなるなどのバグが発生してしまったようです。

これはガラケー端末のカレンダー機能が2019年までしか用意されていなかったことが原因だそう。2020年を表示させることができず、結果として時計機能が止まってしまったのです。まさに20年前に心配されていた2000年問題と同じ事態が2020年になって起こったというわけですね。おそらく当時のガラケー開発者はまさか2020年まで端末が使われると思っていなかったのでしょう。

というわけで今年もwePRESSではWebに関するさまざまな情報をお届けしていきたいと思います。本年もどうぞよろしくお願いいたします。

僕がwebサイトを設計するとき、ワイヤーフレームを作るときに最も大切にしていることは、「言葉」です。もう少し詳しく書くと、「UIや装飾に頼らなくても、正しく分かりやすい表現になっているか？」という点です。理由は、このwebサイトに全て書いてあります。今でも年に何回か読みます。

「これはウェブページです。」
https://justinjackson.ca/words_japan.html

僕がこのサイトを知ったのは確か5年くらい前。その時はまだワイヤーフレームの作り方も曖昧で、今思うとサイト設計の大部分をデザイナーにカバーしてもらっているような仕事の仕方をしていました。きっと、webデザイン＝装飾と考えていたからだと思います。
でもそれは間違いでした。

「言葉はwebデザインの土台」とも言えるでしょうか。デザイン関連の本やwebの記事でしばしば書かれることなのですが、webサイトのデザインの要素を分解すると、「コンテンツ」「レイアウト・UI」「装飾」の3つの分けられます。
要素の名前や分け方は人によって様々ですが、概ねこの3つに分けられる場合が多いです。

その3つを、構造化するとこのような図になります。

「コンテンツ」というのは、キャッチコピーやテキストなどの原稿、及び画像や動画です。それをどのように配置して、どんなUIに乗せて、どんな装飾をつけてどう動かすか、というのがwebデザインだと思います。「言葉」はwebデザインの出発点です。

なので、僕がwebサイトのワイヤーフレームを作る時に一番最初にやることは、「メモ帳に原稿をまとめる」という作業です。お客さんから頂いた原稿やヒアリングした内容から、自分なりにキャッチコピーや、見出しを考え、原稿を作ります。メモ帳に書かれた言葉を読んで「UIや装飾に頼らなくても、正しく分かりやすい表現になっている」と思えたら、Adobe XDを開いてワイヤーフレーム作成に着手します。
もちろん実際は原稿をまとめながらレイアウトやUI、装飾などのイメージも並行して頭の中でしていますし、もっと言うとお客さんへのヒアリングの時点でおおまかなイメージはできていたりします。

経験上、メモ帳での原稿作成の段階でうまく表現ができていないまま制作を進めていくと、たいていは最終的なデザインはメッセージの弱い、曖昧なものになることが多いのです。

やはりwebデザインの本質は言葉だ、と思います。