Dash前の踏み込み段階
商品到着のご報告。
Node.jsと"node-dash-button" libraryでボタン押下イベントをハンドリングするみたいなことを試したかったのです。
縦6cm、横3cm、厚み1.5cm。
このサイズなら冷蔵庫あたりに複数貼り付けていても、邪魔にならないサイズ感です。
そういえば2016年末、バズっていた記事もメモがてらに転載します。
ハード屋とソフト屋の思考の違いの着眼点。
Amazonの脅威は、プラットフォーマーがビジネスモデルから逆算してデバイスを売るという戦略とのこと。
低関与商品の位置づけを、広告からAmazonマーケットプレイスに置き換えるもの。言うなれば広告殺し。
2017年はIoTとマーケティングの実験時代。
新宿三丁目 立ち飲み日本酒BAR 酛（もと）
会社からの帰途。
ふらっと立ち寄りたくなる場所のひとつに「酛（もと）」というBARがあります。
https://tabelog.com/tokyo/A1304/A130401/13111891/
長居するでもなし。一人でふらっと入れるのが良いです（※最近店内満員のこと多いですが…）
会ったことのない銘柄探しという楽しみ方。
リストのなかの好みは、而今。次いで上喜元、飛露喜。
たまの贅沢です。
2016年の振り返り
画像とともに振り返る2016年。
2016年1月。アクセンチュアのUXのワークショップ。
体験のデザインというワークは初めて。
当初、このイベントはUIデザインのみスコープとして扱うものかと想定していたのですが、コンサルタントの視点にたって企画から提案まで問題解決を行うというものでエキサイティングでした。
そういえばこのワークショップ前後で、戦略コンサル企業が国内の広告代理店と衝突していく流れになっていること知りまして。ちょうど時代の変わり目なのですね。
春頃。dotsイベント「デザインの作り方」。
これは事例紹介が中心でした。
既存のゲームやイベントに、技術的、デザイン的な新しい要素を採り入れる。そこに価値が生まれる。
昨今のVRについても、徐々にサービスが立ち上がっていることと通じるものあります。
夏。はじめてのAirBnB。
リーズナブル、贅沢な空間。そして宿舎近辺はなにも設備がないという環境。
こういう施設も出てきているのだというのが新鮮でした。
言葉だけ知っていても、自身の体験に落とし込まないとわかったつもりになってしまうので怖いなと。
秋。水道橋のチームラボにて、Kinnectを使用したゲーム開発イベント。
最終評価の段階で、子どもが最も喜んだものが優勝というもの。
彼らは全力で取り組むのである程度耐久性が求められること、それとすぐ飽きてしまうのでリアクティブな要素を体験に組み込むのが大事なの痛感しました。
AWSのServerless（サーバレス）サービスのワークショップにも参加。
日本のそれは、USAから2年ほど遅れている現状との指摘もあるとのこと。
既存のサービスの置き換えにしても、新規事業にしても、クラウドを使うことで価値を出せるのはなんだろうという意識、大事ですよね。
冬。dotfes 2016。
CyberAgent社がエンジニアとデザイナーの価値を高める取り組みを、4年かけて積み上げてきたことに衝撃を受けました。
開発をオフショアないし完全外注体制からの脱却。社内に知見を貯める制度の構築。
勝てる組織の経営判断といいますか、変われる組織というのが脅威ですね。
最後に下記は、年末のUX関連のイベント。
IMJ流体験デザイン講座の最終回だけ参加。
誰かの不満を解消する。かつその手段は問わずといった条件下の考察は、悩ましくそして楽しいものでした。
UXに投資しない。それが価値あるものであることが伝わらないという点が、海外との明らかな差だとのこと。
振り返りは以上。
総じて、UX周辺に関心高かった気がします。
2017年も、気になることを追っていくスタンスで、手を動かしたり、各イベントで情報集めようと思います。
渋谷dotfes2016 補足編
CyberAgent佐藤さんの講演は非常に学びが多いもので、資料公開を首キリンにして待機していた…のですが、しばらくしても出てこなそうだったので当日撮った写真を補足として載せます。
先日書いたブログの方に、講演内容のテキストを載せているので適宜見てください。
※なお、部分的に公開されているものはありました。
dotFes 2016。
CAのこと、まずは社則の紹介。
この項目に「クリエイティブで挑戦する」を追加するまで4年間頑張った話し。
実践したことは経営陣とのGive＆Take。このKPIを達成したからこういった社内制度を取り入れたいという提案を徐々に推し進めていった。
講演アジェンダ
- CAとは
- CA流のモノづくり
- インハウスデザイナーに求められる役割
デザイン思考の捉え方。美大出身者であれば黒炭の白黒描写で黄色いレモンを表現できるがエンジニアにとってそれはツライ。
エンジニアもデザインを学ぶ時代。それがデザイナーとの成果物への共通理解を深める。
CAではそれを実現する職種を「テクニカルクリエイター」と位置づけている。
なのでエンジニア含めてアニメーション研修もあると。
佐藤さんはDNP在籍時代に「妥協に感動は無い」と教わったとのこと。
インハウスデザイナーとは。制度やサービス各事例をもとに説明。
制度紹介：「デザイナーロワイヤル」
社内メンバーで架空サービスに対して侃々諤々するというもの。ノウハウの蓄積の仕組み。
モックアップを作成して、デザイナー・エンジニア間で議論する場（Tech Lab）もあり。
こうしておくと、実装工程で成果物のイメージがしやすくなる。
Ameba Ownedの事例
コンセプトは、社長の実家の母でも簡単にWebサイトが作れるようになるサービス。
デザイン設計当初は、機能を盛り込みすぎていたので、簡便さ追求してブラッシュアップ。
AbemaTV事例
実際にTVアプリとして使用した場合の体験設計にも注力。
・Web版
・スマホ版
・タブレット版
以上。
モックアップに制作コストをかける。
エンジニア、デザイナー間のプロダクトへの共通理解を深める。
社員の人材価値向上のための制度をつくる。
…等々。
CA社には社内にナレッジを蓄積する仕組みやモチベーションを上げる制度ができていて、社員層の厚い会社であることが分かりました。
理科大学 Advent Calendar 2016 第9日目「OK科のOBがWebエンジニアになるまでの話し」
応用化学科2007年卒の者です。神楽坂キャンパス出身です。
Qiitaアドベントカレンダー眺めていたらたまたま枠が空いていたので、気まぐれに投稿してみます。
TL;DR
- 本を読んで、エンジニアを志望
- SIerからWebベンチャーへ
- おちこんだりもしたけれど、私はげんきです。
2007年といえばもう10年近く前になるのですね。おっさんの独り語りなので気楽に読み流してください。
略歴、学部生のときはプログラムを書いた経験なし。新卒入社後、初めて書いた開発言語はVisualBasicScript。
迂闊に書いたスクリプトがWindowsレジストリを壊してOS動かなくなったのは苦い思い出です。システムエンジニアからWebエンジニアになっていまに至る、と。
振り返ると、当時流行った梅田望夫さん著書「ウェブ進化論」に触発されて、システムエンジニアを志望しました。
そのときアタマにあったのはエンジニアになりたいの一心で。
悲しいかな、SIer所属のシステムエンジニアとスタートアップのWebエンジニアとは似て非なるものなのですが、その頃は知る由もないのでした。
（※開発思想の相違なんかが最近明文化された感じします、エンジニアの認知度だとドラマ逃げ恥の影響凄いですよね…）
団塊世代退職を見越した新卒売り手市場（だったらしい）で、手を挙げれば情報系の経験を重視されずにシステムエンジニアになれる雰囲気があったのですね。
一般にSIerと呼ばれる資本力があるようなところが大量採用していたようで、その流れに乗ったような具合です。
テスターとして入ってExcelでテスト直交表をつくったり、納品用のPCを大量にセットアップしたり。
ひとつのプロジェクトに20人くらい集められて、3ヶ月から半年くらいのスパンで新しい業務へみたいな世界。
趣味でPHPのスクリプトをいじったりしていたものの、業務ではWeb技術に触れる経験も少なく。外界の情報はネットから仕入れるだけといった環境でした。
RSSリーダーが流行っていて、はてなRSSを200個近く登録して必死で情報を追っていた頃。
ネットに張り付いていると、東京のそこかしこで面白そうなイベントは開催されているのですね。昔のものですが個人的に推しイベントは下記のもの。
- ソーシャルブックマーク研究会
- 天下一カウボーイ大会（1回、2回、3回、4回）
いまもし自分が学生だったら、気になる技術を見つけてdotsの勉強会行ってみたり、StartupWeekendとかMashupAwardとか出てみたりしていると思います。
そんな頃合いで、2009年にシリコンバレーツアーが開催されるというので参加し、情報技術が花形とされる文化を目の当たりにしました。現地で活躍しているエンジニアいわく、技術があれば海外でも飯が食えるという。
定年まで1社で勤め上げるというイメージは、それらで情報を仕入れていく過程で崩れていきました。
さてはて、新卒入社から3年も経つと、高校同級生の友人が知人と起業するというので乗っかってみることに。
キャッシュが無いので昼は光フレッツの営業、夜は帰って自社プロダクトの開発の日々。
半年くらいで根を上げてしまい離脱。
その後、1社ソフトウェアベンダーを挟んで、いまのWebベンチャーへ転職。
なぜこの段階でWebを志望したかというと、本に書かれた世界に行きたかったから。その技術を身につければ、世界が近くなるから。
採用前の裏話として、いざWeb方面に行くべと思うも、Webの経験はプライベートしかない。ソフトベンダーではDelphiという言語を使っていたので、これもまたWeb実績にカウントされない。
そこで事前の対策として、mixiのOpenSocialの仕様を読んでPHPでソーシャルゲームアプリを作ってみたり、出てきたてのGoogleAppEngine上にJava＆javascriptでWebアプリを作ってみたりして、面接に望むなどしていました。
デザイナー職では過去制作物をまとめたポートフォリオの提出などあると聞きますが、エンジニアも同様、レンタルサーバを借りて自身の作ったものを見せられたほうが良いというよくある学び。
いまの会社ではWeb技術をふんだんに学ぶことができてハッピーな感じです。めでたしめでたし。
最後に。現在うちの会社でも新卒採用しているのですが、学生時代に何を作ったか、どんな成果物があるのかを問いたりするので、就職したらすぐに手を動かしたいベンチャー志向の学生の方にはウェルカムな環境です。
ただ、自分のように学生の頃に何もしてこなかったけど、エンジニアになってみようかなという気持ちがあれば、まずは間口の広いところから入ってみて、技術の海に潜ってみるのもありなんじゃないかなと思います。
いじょ。
あなたに使えるUXデザイン入門 by STANDARD & IMJ
ワークショップに行ってきました。
UX、デザイン思考、サービスデザインのための「あなたに使えるUXデザイン入門」
https://uxd-hcd-waiwai-cafe.connpass.com/event/44108/
2016年12月3日（土）13:00-18:00
UXって単語はイメージ先行して、必要そうなのだけどまず何から始めたらいいかわからず。
その一方で、そのデザイン手法を言語化・社内浸透させてビジネスに活かしている企業も出てきている昨今です。
> ※イベント内で得た情報を口外しないことを条件でのご参加となります。
ということなので、参加してみての所感中心に残します。
UX探求、といいますか自身のUXへのモヤモヤ感解消のため、参加してきました。
※なお、このイベントは全5回構成。最終回からの初参加回といったハードルはありましたがどうにかなるものです。
なお、イベント開催にあたり、
> ※イベント内で得た情報を口外しないことを条件でのご参加となります。
ということなので、参加してみての所感中心に残します。
ワークショップは2部構成、それぞれ50分ごと。
1部：現状理解→社内導入シナリオ
2部：1部の情報を上司提案
その後、各チーム発表とメンターからの総評。
という流れでした。
前ワークショップで洗い出したUXデザインに関心ある層のヒアリング内容をそれぞれ付箋紙に落とし込んで、1枚の模造紙上に貼ったものが、現状理解の前提として用意されたものです。
そこの100枚相当ある付箋をカテゴライズするのが大変で、結局50分で完遂できず…。
反省点としては、序盤の時点でカテゴリーの粒度を大きくしたところまでは良かった。
が、その次の段階で、中程度の粒度のカテゴリーを細分化した上で、さらにカテゴライズするのが難しかったといいますか。。
どういった尺度で考えるとカテゴリーを切り出しやすかったか悩みました。
その後、上司役へ提案するための「仮説ステートメント」を作成。
仮説ステートメントとは、以下内容を1枚のA4シートに収めたものです。
- 誰に対して？
- どのような仕組みor機能で？
- なにを実現できる？
- その結果、どの指標をもって効果が測れる？
作成にあたり、とにかく枚数を出すのが大事。でも実現しやすさ、小さく始めるられることも大事というのが学び。
ここで求められるのは、誰に対しても利用可能な抽象化された汎用プランではなくて。
ターゲットの悩みや困っていることをヒアリングの事実を基に仮定して、それを解消する仕組みを用意することで、継続的に改善できるシナリオを作ることでした。
このあたりについては、口外できない内容として、現場のお話もありました。
最後に新刊案内がありました。
UXを学ぶ緒として後日読みます。
以上。
参考図書
dotfes2016 in shibuya
遅ればせながら備忘録。
去る11月20日。dotfes2016 行ってきました。※Twitter：ハッシュタグ
＃Session 2-B「 テクノロジーと機械学習」
濱田晃一さん DeNA テクノロジー
去る11月20日。dotfes2016 行ってきました。※Twitter：ハッシュタグ
デザインの社会人向け学園祭みたいな感じ。
開催場所は、渋谷ヒカリエの21階と24階。
場所はお洒落だし、ケータリングもあるしで素敵な空間でした。
そういえば昔、廃校で開催された回に行ったなーと調べてみると、なんとそれは第1回で8年前…。
あの頃はFlash全盛期で、ガジェットのArduionoが出た直後くらいだった頃。
いやはや光陰なんたらですね。
講演録をメモします。
なお、参加したのは下記コンテンツ。
Must to readな資料は下記にて。
# Session 1-B デザインと経営
けんすうさん
ペロリ中川さん、有川さん
デザインとはなんぞやの概念がずれる
経営層と職種。
体験設計
情報設計
ビジュアル作成
UIデザイン
マークアップ・コーディング
採用側のUXデザイナー
情報設計、ビジュアル、UIデザイナーまで
応募側
手法、体験設計できます
机上の空論はいいからデザインほしい…みたいになる
体験設計〜UIデザインまでできるのがUXデザイナー
中川さんはどんなひとを採用したいか？
・経営の観点からみて
デザイン、説明が求められるので数字の根拠が出せるひと
有川さんは？
・昔と比べてデザイナーに求められているものが変化した
ビジュアル作成、UIデザインまでがデザイナーだった時代があった。
SEO、マーケもデザイナーに求められる時代
これは体験設計ありきで話しがはじまるから、ディレクターのスキルがデザイナーにも必要になってきたから？
Likeでアニメーションが起きるのが良い、提案はデザイナー主導
ディレクターの？デザイナーの？という責任所在は不毛。
動くものを見せる
提案時点では、画像でもOK、他社さんのでも。
アニメーション。UX高めるのには勝手にこっそりやる。が、たまに改修でかぶるのは課題。
限られたリソース。
「MERY」のロゴ。の設計が秀逸。
紙でもいけるようにイメージ。
テキストロゴ
視認性
ブランド名の認知向上
覚えてもらいたさ
リアルの場に出ていく
リアルのクリエイティブをやる
Webだけだと厚みが出ない、それを解決するコンセプト
MERYロゴの羊はアプリにも使いづらい、ぼける
機能的としてなら文字ロゴ
当初のロゴ案
ひつじ以外は、Webっぽい感じ
社内でアンケート
4つくらいの案から
ただ、だれもひつじを支持しなかった、だから選ばれた。敢えてWebサービスとして出した。
セオリー通りではないけど、攻めていこう。Webらしくないのが、逆に覚えてもらいやすかろう。
２．デザインと経営の意思決定
経営と距離
有川さん
デザイナーと一緒につくる
デザイン的にA案
KPI設計的にはB案
違和感で押す、悪目立ちすることもある。
やりすぎてブランド毀損になることはしない。規定を決めている。
温度感を合わす。
ビジュアルですり合わせる
言語化でなくビジュアルイメージで話す。
３：ロジックでは説明しずらいデザインを他のボードメンバーや親会社にはどう伝えるか
デザインの話しはしない。伝えてない。
中川さんがDeNAで話す相手、守安さん。
親会社
情報量違うから細部を話してもしょうがない。
クライアントに話ししても相手に伝わらない？
ロジック？感覚？量で伝える。
こういうアップデートしたい
短期的にはノイズになる
変数を残して進む場合もある
デザイナーをそばに置いて話しを進める
けんすうさん
人類の起源から話す…
リリース時はちょっとださいのが良い
CGMについて中川さん
日本でAirBnBやりたいとしてサイト作るも、日本の家はあんなきれいな部屋画像でない…みたいな。
どのくらい部屋画像を載せるか。
キレイな画像を集めるのか。
素材の要素も大事。
意思決定
「デザインカンプキレイな画像すぎる問題」
ちょっと汚い画像も使ってみる。長い文字の改行で汚くなるとか。
ラーメン
チャーシューが美味すぎるとラーメンが見劣りする？みたいな。
画像
スライドさせる？
でかく？リストビュー？
更新頻度変えてみたり。
４：経営者が求めるデザイナー像
デザイナー
ビジュアルデザインとUI設計ができる
完成形に近いUIプロトタイプをつくって開発をスタートする
UI設計
ビジュアルデザイン
マークアップ→外注
コーディング→外注
※Nanapi（旧名Flying）のワイヤーフレーム事例
プロトタイプ起点
中川さん
完成形に近いものを持ってきてもらう
趣味感覚で割れるのは、コミュニケーションタイミングが悪い？
そもそも前提が違っていたりするのは問題
有川さん
昔と比べ、議論のためのデザインのステップが増えた（ひっくり返るのはよくある話し、壊れる前提）
ディレクター
優劣はない
プロダクトベース
細かいところの把握
グロースのために振り切れた
濱田晃一さん DeNA テクノロジー
石坂昌也さん Mery デザインブランディング
深層学習とは？
深層学習
人工的に実現するアルゴリズム
データをもとに賢くなるアルゴリズム
多層ニューラルネットワークでアルゴリズム（データから複雑な特徴表現を自動獲得するのがブレークスルー）
DeNA全サービス
Mobageを支える技術
2012年入社
登録1500名…TokyoWebMining
ユーザの感性創作に寄り添う
「3.8倍」
→これは、性年代デモグラで最適化したユーザー体験の効果数値
感性・個性
感性（ファッション、テイスト）
Convolutional Statics
MERY：商品から辿れる
その人に合うものをリコメンド
独自生成のソシャゲアイテム
機械学習による体験提供
数千万人
50億超のアクションがある
感性、個性、創作
ソーシャル情報の活用。
興味あった情報
AI、深層学習の部分
2015年2月 深層学習認識能力は人間能力を越えている
例：画像1000カテゴリを分類、判別
人間 5.1％
DLエラー率 2012年16％→2015年 5.1％→2016年3月 3.08％
150層を超える深いNL
認識
知能
事例各種
画像の見出し文生成
文章から画像生成
複数質問文からの応答
画像からの文書作成
楽曲生成（メトリカ風とか）
音声生成（抑揚がむずかしかった）
画像のスタイル変換
MERY
スタイル、テイスト
マンガボックス
好きなイラスト画風
…
石坂さん
根拠のある飲料
愛着のある飲料
味覚で美味しい飲料
ブラインドテスト
ヒトの連想＝ブランディング
「連想をつくる言語化、可視化を伴う戦略」
※デザイナーは経営陣も巻き込んで欲しいという意図
現場のブランディング
露出型ブランド 新規事業
共感型ブランド スタートアップ型
点火が大事
火花が大事
遅効性の安定感（先に体験を設計しておく
※ブランドの強み
プロダクトが慣らされること
技術データ世界レベルのブランディング
公開前にサービス体験に仕込む
市場で2番手と差別化できる
１：AIとの関係？
海外強いエージェンシー
クリエイティブのレベルが高い
羅針盤が足りない（正しいAIがそれ
２：ユーザーへの新たな価値提供？
３：MLとブランディングに向かうためには？
やってみて試してみることが大事
クリエイティブは手強い
＃Short Session「スマホゲームにおけるVRコンテンツのトレンド紹介」
Qualiarts
ソシャゲコンテンツ
相良さん
オルタナティブガールズ。
VRには2モードある：ジャイロモードとVRモード
VRを意識した設計
近づいてくるからハイポリで作ること
Unityで立体的につくるのは容易、ただしそれは静置の平面上に限る。
平面で見ると立体感がなくなることがある、リアリティの欠如
フェイシャルアニメーション
後ろから抱きしめるとか、ユーザー視点を喪失するのでNG
音声演出で、ユーザーの視点を確保するのは有効らしい
FPS低いと酔う
1.5分くらいで制限する
ユーザーの首振り対応
加速度センサで取得したり。
スマホで背面カメラ
外の映像取り込んで、視点移動を取得することは可能らしい
＃Session 3-B「 デザインとビジネス」
サイバーエージェントのサービス
佐藤洋介さん
クリエーティブ統括、執行役員
CA Seruices
Twitter: @sugaar
AmebaTV、AWAとか
2007〜2012 DNP
2012〜 CA入社
クオリティに妥協しない組織
デザイナーからの巻き込み方
Mdnの連載事例も。
CA特徴①
色々ムービング
1年前は動画つくると思ってなかった。
AWAはabex合弁
年間50サービスくらいリリースしていた頃も。
合弁も進んでいる。
デザイナー入社だったが、CM創ったりもしている。
柔軟さ大事。
CA特徴②
ギラギラ
鼻息人材。
CA③
まずやってから持って来い
最高だと思うものを。
Simplog
きいてよみるちょ（1週間で作る）
CA④
最高か最速か
リリースの話し
確認の確認待ちとかは無い
CA⑤
クリエイティブで勝負する
組織マネジメント①
技術者は専業主婦
組織マネジメント②
前のめりにころんだやるにはセカンドチャンスを。
※先日、1日8社が、新卒メンバー代表として生まれた
組織マネジメント③
組織は縦軸
職種は横軸
メディアには60名、週一定例しておくとか
黄色のレモン→黒い鉛筆→矛盾
AbemaTV
スマホはPixate
LeanBackのUIを参照。
Abeam Owned
Ambleを進化させたものがほしい
社長の母親でも使えそうな感じ
First Impression
視覚情報強い
３Q
30サービスを月１チェック
デザイナープロデューサーへのFeedback
失敗を適度に意識させる
全体でのデザインFB（デザイナーロワイヤル、担当外への改善案をする会議）
周囲へスキルをどやれる機会、スキル差の認識する機会
サービスループ
モックレビュー
全サービスを
IN House Designer
Company 思想をもとに利益を守る
User ニーズをもとに価値を求める
経営のための最大限
アイデアを広げ
ユーザーにとって価値あるものに着地させる
インハウスデザイナーの心得
妥協に感動は無い
妥協のある自信のあるアウトプット
採用に妥協しないので、もし妥協したら環境を疑う。
EX：
Trend of UI Design
MdN連載
Q：
デザイン修正
A：
メディアに藤田さんが入っている
エンジニアからの指摘で立ち代わることもある
Q：
評価環境。
A：
貸し借り。事業伸ばした、代わりに好きなこと１つやらせてもらった、社内制度。
４年間かけた。牛歩のように。クリエイティブで勝負する、を標語に加えてしてやった感。
# Session 4-A「 デザインとテクノロジー」
MESH by SONY萩原さん
機能を自由にカスタマイズできないのか？
大企業内でもプロセスが変わってきた
クラウドファンディングの利用
Indiegogo
FirstFlight
MESH
Make
Experience
Share
モノ、コトのデザイン
インドで売れ行き良い（※販売していないけど…）
掃除を楽しくする
ホバークラフトが連動して動くとか
SONY ExploraScience
対象年齢、小学生以上
子供部門：鼻水カメラ
鼻をかんで褒められたいとか。
カメラに遊びを入れてみるとか。
一般部門：Smart Hiking Stick for 富士山
カラーガイドに従って、先頭を歩くひとに意思を伝える。
現在開発中で、年明け目処。
アイデアの創出方法をデザインする。
新しい組み合わせ。
デザイン：By 大辞泉
目的をもって具体的に立案、設計すること。
テクノロジー
実際的目的のために工学的に応用する方法論。
体験のデザイン
アイデア＞プロトタイプ＞テスト
超カンタンに、超はやくPDCAを回すことができる
日常をハックするMESH。
以上。
