WTM106 アナログとデジタル／プロダクトとプロモーション

ウェブタッチミーティング106
SESSION#3　21:00－21:30
フォローアップ

1　林業とトレーサビリティー
2　視覚表現なしのデザイン　販促と製品開発を兼ねる
3　点と線の将棋をリリースして　スマホと指操作の座標取得チップス
4　イラレでテキスタイル表現

YAMPUU - 柳谷武
広島
CENSA inc　CEO　https://censa.jp
CANDO CORPORATION　CCO　https://can-do.co.jp　

ウェブやアプリを再解釈すると製品開発なのか販促施策なのかどちらの意味にもなる曖昧な表現を作ることができるなと考えています。事例を元に掘り下げてお話しする30分になればと思っています。

1
林業とウェブ
切り株が辿れるプロダクト

　ヒバリングス：http://hibarings.jp

コースターやブックエンドのIDを入力すると、樹がはえていた切株の座標を確認でき、植樹年から間伐年、樹齢、山主、間伐者などがわかるプロジェクトです。
購入前の目線から見ると、間伐インフォも含めて購入価値になり。
購入後の目線から見ると、モノの背景を見返せる。
プロダクトとプロモーションの両目線の流れを持つ商品となります。
JR広島駅 ekieに棚をもらい販売中。

2
販促兼製品開発
しゃべるレジごっこ

　レジごっこ：https://censa.jp/design/pages/regigoccoapp/

カードをかざすと「チョコレート37円」としゃっべてくれます。
メインプロダクトは木のお金と商品タグカード、サブプロダクトとしてレジアプリがある構成です。パッケージにてかざし方などを説明しています。
そしてヒバリングス同様二つの目線の図です。
プロモーションから始まる流れでは、メイン商品を知らずにアプリを無料ダウンロードしてQRコードを自作してもらい遊ぶ流れ。
プロダクトから始まる流れでは、木のお金だけを5000円相当で購入となると高く感じますがレジもついてくるとなるとちょうどいい価格に。

また、昨今音声認識が当たり前になり、画面が存在しないプロダクトもでてきています。プロダクト開発のデザイナーのノウハウが、ビジュアルをつくらない仕事でも活かされるかどうかは今後気になるところ。
レジごっこもディスプレイをふさいでも遊ぶことができる構成です。

デイスプレイがなくても遊べる。

　カードをかざす　→　読み上げ　→
　大人とやり取り　→　おつり計算　→
　木のお金で支払い　→　上手にできた(もりあがる)　→
　繰り返し　→

次に技術的なお話
QRコードの原理を分解して考えてみましょう。

　通常のQRは

　二次元バーコードを読む　→　文字を認識　→
　文字がURLである　→　ウェブページへ

　レジごっこの場合

　二次元バーコードを読む　→　文字を認識　→
　文字を読み上げ　→　金額抽出表示

という流れで成り立っています。

「レジごっこ」ぜひインストールしてみてください！

3
点と線の将棋をリリースして
漢字のない将棋

　いえしょうぎ：https://censa.jp/design/pages/ieshougi/

WTMや休みに入る最終の会で「将棋アプリ作ります」と話をしてからその後リリースされているので報告です。その後、App Storeで「今日のAPP」に取り上げられ足りしました。
特徴としては漢字を使わないことで「感じでは表せないコマの動き」をつくることができます。木のコマもかわりゴマがあり、アプリでもカスタマイズUIが用意してあります。

作るときのこだわりポイントとして、感覚とセンサーの座標ズレのもんだいがありました。
PCはマウスを1pxごとに細かく操作できる偉大なデバイスですが、スマホは指4つで画面の横幅になる程サイズが小さいものです。
81マスをスマホで操作するのはシビア。隣のマスを選んじゃいそうになります。そこでタッチ座標をそのまま取得するのではなく、処理を多くは挟んでいます。タッチ座標とすべてのコマの中からの最短距離のコマを算出(三角関数つかってます)座標差をオフセットしたままドラッグ操作になります。

　デモ

この処理を挟んだことで、遠くから選択できたりキャンセルしやすくなり操作が楽になりました。

「いえしょうぎ」インストールしてみてください！

4.1
イラレでプロダクトデザイン
テキスタイルや形状

瀬戸内の荒い砂
ビーチスポーツ専用シューズ

　SLOG：https://www.makuake.com/project/solg

瀬戸内は波が少なくビーチは砂が荒くなっています。
全国のビーチスポーツ会場の中でも、瀬戸内はビーチ用シューズが破れやすいビーチです。
軍手メーカーとプロテニスプレイヤーが開発している荒い砂や砂の高温に強いシューズを作ることになったのがSOLGのプロジェクト。
家っと最近ソックス部分に柄をデザインできるようになりました。
(昔はストライプのデザインしかできなかった)
イラレでデザインをしたものがソックスの形状に展開されています。

4.2
イラレでプロダクトデザイン
テキスタイルや形状

山と谷のつみき
YAMAZUMI

　EC https://www.sukima.gift/items/23172747

こちらもイラレでつくったプロダクト。
仏壇欄間職人さんと作っています。
夏のイベントでも遊びコーナーで高く積んで盛り上がってます。
形状もバラバラ、一辺ごとの部品になるとさらにたくさんあります。
どのパーツがどれとどれの組み合わせか、側面図をイラレで作って職人さんに指定しています。
パーツはひとつひとつ加工、高周波で接着しています。

売り場では広銀本店1F BANCARTさんに仕入てもらったり、
最近家業の自社メーカーSukima.の直販ストアが西十日市榎町にできました。そこで販売したりしています。

本日のまとめです。

アナログとデジタル、プロダクトとプロモーションの軸で話を進めさせてもらいました。
通常のウェブ制作現場では図のようにデジタルプロモーションの方よりになります。
ウェブサービスになると日々使うものなのでデジタルだけどプロダクトと呼べるでしょう。
そして今日登場したSukima.のアプリたちはデジタルとアナログをまたいでいます。ヒバリングスもそうです。

みなさんにも領域を広げ「領域を混ぜる」意識をしてみてもらうと、それぞれの得意分野の新たな視点が見えてくるかもしれません。

ありがとうございました！

久しぶりのWTM登壇でした。新たな体制で定期開催がはじまり、実際に当日始まってみると20～50代まで広島のウェブ業界の現場にいる人達が幅広く集まりました。現場コミュニティーとして横のつながりが深まりそうな予感です。