日記

  • 古いワードアートをいろんなところで利用できるように画像保存する方法

    超ニッチで日本で多分自分にしか役に立たない記事を書く試み。

    みなさん!ワードアート使ってますか?
    最近のワードだと、古き良き懐かしいワードアート が使えませんよね!

    昔頑張って作ったファイルも今のパソコンだと残念ながら正常に表示されない可能性が高いのです。
    確実にMacやGoogleスプレッドシートではきちんと表示されません。

    古いパソコンを入手しよう!

    まず、Office2007より前のものが動くパソコンを用意しましょう。
    OSはwindows7はもうすぐサポート切れるし、当然office製品もサポート切れてるので何があっても知らない!古いパソコンはネットに繋がないでくださいね。
    Wordのあのクソダサ懐かしいアートスタイルのためならセキュリティを犠牲にしても構わない!
    そんな酔狂なひとだけ試してくださいね!私は怖いので、使わない古いwindows10の動くパソコンにoffice2003を入れています。ワードアート を作る以外に使わないパソコンです。

    ちなみに古いofficeの動くパソコンなんかいくらでもあるだろ・・・と思ってたんですが入手難易度は以外と高いので頑張ってください。
    ヤフオクとかフリマなら手に入りやすいんですかね?
    (しかし頑張って得られるのは、セキュリティガバガバ、スペックの低いゴミです。ただし、ワードアート が作れます

    ワードアートを作成する。

    作るのはエクセルが良さそうです。
    できるだけフォントサイズをあげてワードを作成しましょう。

    そしてできたワードアート をコピーします。
    その後適当なセルで右クリックして「形式を指定して貼り付け」

    「図(PNG)」を選択しましょう。

    その後エクセルファイルを保存すると、他のパソコンやgoogleスプレッドシートでもワードアート が表示されます。

    表示されているのは画像データなので、画像をコピーして他の画像編集ソフトに入れて編集することが可能になります。
    あとは好きに煮るなり焼くなりしちゃってください!

  • Vue.jsを最速で学んで取り入れたい!という記事

    むかーしにvue.jsの勉強を試みた記事があったんですが、それを見返したら何もやらずに終わってました(驚愕)

    リベンジ編ということで必要な範囲を最速で勉強して、業務に取り入れていきたいと思います。
    こんな感じで、勉強して咀嚼してブログに投稿するというのが、最速の技術習得方法だと思っています。
    そのノウハウについても、そのうち記事にしようかな。

    やりたいのはjQueryをVue.jsに置き換えること。

    jQueryって依然として使用率高いと思うんです。
    だって使いやすいし、簡単だし、普通の仕事の範囲だったら全然事足りてるし・・・ある程度複雑なプログラムだって組めちゃうし・・・と特に現状に不満がないスーパー有能なライブラリだと思うのです。

    しかし、先進的な人たちからは嫌われており、変えろ使うな古い遅いなどと罵られているのです。
    かわいそうに・・・。
    多分まだまだ生き残るし、10ページとかのサイト規模であれば変える必要なんてさらさらないんでしょうが、だからと言って新しいものを学ばなくても良いということにはならないと思いますので、Web業界でいきぬく為にも、ちゃんと学んでおきましょうねvue.js(jqueryが死なないという予測なら次の流行りを待ってもいいかもしれんけどね)

    jQueryの嫌われている理由

    2006年からあるツールですので、設計思想が古く、またレガシーなブラウザに対応する為に肥大化しているということも問題の一つにあげられるのだそうです。
    当時はWebアプリケーションという考え方はなく、HTMLはただの「文書ファイル」。
    データベースとのやり取りをする大規模アプリケーションにはjQueryでは辛いものがあるのだそうです。

    Jqueryは直接要素を書き換えますが、最近は仮想DOMという考え方が主流だそうです。
    書き換え処理をするのは仮想DOMの方で、表示にはそれを反映するだけ、という考え方みたいです。
    それにより、高速化や設計しやすいなどいろいろメリットがあるみたいですね。(まだ勉強前なのでイメージで言ってる)

    やりたいのはjQueryの置き換え

    最初に書きましたが、複雑なことはやろうと思っていません。
    現在jQueryで行なっていることがjQueryでおきかえられればいい・・・ただそれだけなのです。
    それでは以下に具体的にどんなことがしたいか記載していきます。

    • クリックでプログラムを起動する 済
    • クリックで要素にclassを追加する 済
    • スクロールで要素にclassを追加する(パララックス) 済
    • ウインドウリサイズでプログラムを実行する 未
    • スクロールアニメーション 未

    プラグインで行なっていることの代替

    • スライドショー 未
    • スマホメニュー 未
    • lightbox 未

    この程度だと思います。
    アニメーションに関してはCSSをできるだけ使えば問題ないと思います。
    これから調べて記載していきたいと思います。

    やってみよう

    使い始めてみる

    <script src="https://cdn.jsdelivr.net/npm/vue@2.6.10/dist/vue.js"></script>

    vue.jsをCDNで読み込むだけで使い始められます。簡単ですね。

    Vueオブジェクトを作る

    jQueryと違い、「vueオブジェクト」を最初に作ります

    new Vue({
                el: "#app",
                data: {
                    count:0
                },
                methods: {
                    countUp: function() {
                        this.count++;
                    }
                }
            })

    el → スクリプトの影響範囲の指定
    data → 情報元の変数の指定(データベース)
    methods → 実際に動かすスクリプトの名前を指定し、スクリプトを書く

    クリックで起動する

    jqueryの考え方とかなり違いますので頭を切り替える必要があります。
    ①vue オブジェクトで「影響範囲」「データの変数」「実際に動かす関数」を定めます
    ②HTMLの方では「影響範囲に指定したID」「実際にデータを表示する場所」「起動の条件(今回はクリック)と関数名」を指定する必要があります。

    クリックでクラスをtoggle切り替え

    メソッドのifで値をみて切り替えを行なっています。
    「data」で作成した変数を操作するときは頭に「this.」をくっつける必要があるみたいです。
    覚えておきましょう。
    「v-if」でhtmlの方に書いてtoggleを実現する方法もあるみたいですが、自分が理解しやすいやり方で実装しています。そっちの方も試して、メリットがありそうなら追記します。

    スクロールでメソッドを実行

    https://jp.vuejs.org/v2/cookbook/creating-custom-scroll-directives.html

    カスタムディレクティブといってディレクティブを作ることができるみたいですね。

    試行錯誤の上こんな感じになりました。(カスタムディレクティブをつける要素がどこが適切なのかよくわかりません)

    <!DOCTYPE html>
    <html>
    
    <head>
    	<meta charset="UTF-8">
    	<title>Vue.js sample</title>
    	<link rel="stylesheet" href="style.css">
    	<script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.js"></script>
    	<style>
    		.aaa {
    			background: red;
    		}
    
    		.bbb {
    			background: blue;
    		}
    
    		.scValue {
    			position: fixed;
    			top: 0;
    			left: 0;
    		}
    	</style>
    	<script>
    		window.onload = function () {
    			Vue.directive('scroll', {
    				inserted: function (el, binding) {
    					let f = function (evt) {
    						if (binding.value(evt, el)) {
    							window.removeEventListener('scroll', f)
    						}
    					}
    					window.addEventListener('scroll', f)
    				}
    			})
    
    			// main app
    			new Vue({
    				el: '#app',
    				data: {
    					actives: "bbb",
    					scPos: window.scrollY
    				},
    				methods: {
    					handleScroll: function (evt, el) {
    						this.actives = "aaa";
    						this.scPos = window.scrollY;
    						if (window.scrollY > 50) {
    							this.actives = "aaa";
    						} else {
    							this.actives = "bbb";
    						}
    					}
    				}
    			})
    		};
    	</script>
    </head>
    
    <body>
    	<div id="app" v-scroll="handleScroll">
    		<p class="scValue">{{scPos}}</p>
    		<h1 class="centered">Scroll me</h1>
    		<div>
    			<p>ダミーテキスト ダミーテキスト ダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキスト
    				ダミーテキスト ダミーテキスト ダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキスト.
    			</p>
    			<p v-bind:class="actives">
    				ダミーテキスト ダミーテキスト ダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキスト
    				ダミーテキスト ダミーテキスト ダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキスト
    				ダミーテキスト ダミーテキスト ダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキストダミーテキスト ダミーテキスト.
    			</p>
    		</div>
    	</div>
    </body>
    
    </html>

    やはり得意なところはjsonのようなデータの出力とinputからの書き換えな気がする

    いろいろ見てきましたが、上記の内容はjqueryに任せてしまった方が早いんじゃないか?と個人的に感じました。
    inputでデータを書き換えたり、入力した内容を即HTMLに反映したり、サーバーで出力したjsonデータを表示したり・・・というところがやはりvue.jsの得意とするところなのだと思います。
    webアプリ作るなら取り入れた方がいいけど、小規模な静的サイトなら特に入れる必要はないというのが自分の中の結論です。

    次回は、jQueryとVue.jsの共存というテーマで調べて記事を書いてみたいと思います。

    その方が現実に即していて、すぐに仕事に使えそうな気がする。
    置き換えるのではなくて、共存しながら追加していく・・・という考えでいきます。このブログは。

  • Illustratorの代替ソフトはxdで決まり!

    【注意】本格的な印刷には使えません。素直にイラレ使っときましょう。

    追記 : 2020年4月から無料ではデータ共有ができないみたいです。あんまりいいソフトではなくなってしまったかも・・・

    この記事の対象者

    • svgのアイコンを作るのに使いたい
    • 簡単な図を作るのに使うソフトがイラレの代わりにほしい!
    • Webデザインではイラレはほとんど使わない!

    という場合です。

    また、普段ワードやパワーポイントで作っているA4のpdf文書をグラフィックソフトで作りたい、という場合にも使えるかもしれません。(クオリティはそんなにあげられない気もしますが)

    アイコンを作ってみよう

    • 四角/丸の描画ツール
    • ペンツール
    • パスファインダー(結合・切り抜き)
    • svg形式での書き出し
    • 文字のアウトライン化(Ctrl + 8)
    • 選択ツールでパスとハンドルの編集

    これくらいできればいいのではないでしょうか?
    これ全部できます!
    Illustratorいらないんじゃないですかね。
    ちなみにxdは無料です共有ドキュメント数に制限があるのみで、Adobeのアカウントをつくりさえすれば使えますので、ぜひ活用してみてください。

    描画ツール

    三角・丸・四角・線 などが描けますね。

    パスファインダー

    図形を選択して、右側にあるパスファインダのツールから結合できます。
    四角と三角を組み合わせれば、矢印も作れちゃいますね。
    少し上をみてもらうと整列ツールも備わっているのがわかります。

    ペンツール

    ベジェ曲線も問題なく作成できます。
    ハンドルもイラレとほぼ同じ操作感です。

    選択ツールでパスとハンドルの編集

    白い選択ツールどこ・・・?ってなりますが、オブジェクトをダブルクリックするとポイントをいじることができます。曲線ならハンドルの編集も可能です。
    alt(option)とかを使うと細かな操作もいろいろ有効になるはずです。

    文字のアウトライン化

    アウトライン化もちゃんとできますよー。
    文字を選択して
    オブジェクト > パス > パスに変換
    ショートカットは command + 8 or cirl +8

    SVG書き出し

    こんな感じで書き出せます。ここはほかの詳しいサイトを見た方がいいかも

    まとめ

    これで足りたでしょうか?ぜひ試して活用してみてください。

  • 稼ぐ言葉の法則

    とても勉強になった本です。
    商品・サービス・広報など考えるときは一度このフィルターを通そうと思いました。

    ↓フレームワークのエクセルファイル

  • UXとは何か?その本質を解説してみる。

    UXについての本をたくさん読んだので、まとめとしてこちらにアウトプットしたいと思います。
    出来るだけ正確に書くことを心がけますが、ここには自分の解釈で記述していきます。(間違っても寛大に・・・指摘お願いします)
    ちゃんと学びたい人は自分で本読んだりしてね。

    UXとはなにか

    ユーザーエクスペリエンス、顧客体験、ユーザー体験などと呼ばれるものです。
    端的にいうと、顧客満足度を考えてモノやサービスを作り出すことです。
    人によって解釈が変わりそうな感じですが、研究している人によりしっかりとUXの概念は定義されています。(ここではあげませんが・・・)

    UXは手段ではなく目的である

    「〇〇は目的ではなく手段なので気をつけましょう」
    というのはどこかで耳にしたことがあるのではないでしょうか?
    では目的とはいったいなんなのか。そう、UXこそが目的です。
    UXとは目的であり、目的がなんなのか探ることです。

    UXを考えるにあたって避けて通れない
    利用文脈(コンテクスト)

    UXについて勉強していると、最初に利用文脈という考え方を知る必要がでてきます。
    利用者はどんな人でどういう経緯でそのモノやサービスと触れているかを考える必要があります。
    最終的な目的や満足度は、利用者の立場や経緯で変わるということです。

    例をあげてみましょう。「時計」で考えてみます。

    とあるサラリーマンは趣味の登山のために、時間を確認するために腕時計が欲しいと思っていました。
    登山で利用するためすこぶるタフなモノか、一度使って使い捨てるようなモノが欲しいと思っていました。その人は丈夫で耐水機能を持つスポーツ用の時計を買いました。

    この方は丈夫なスポーツ時計を選びました。

    とあるサラリーマンは、時間を確認するために腕時計が欲しいと思っていました。
    打ち合わせや、ビジネスで使うため、高級感のあるモノが欲しいと思っていました。また、機械時計が好きで眺めるのが好きなため、自分の好きな機構を持った、おしゃれなデザインのものがお欲しいと思っていました。

    この方は、スポーツ時計は選びません。それなりに値段の張る、機械時計を選びました。

    このように、時計を選ぶ場合でもその人がどんな人で、どんな経緯でそれを欲しがっているのかを考える必要があります。これが利用文脈(コンテクスト)です。
    後者の例で、時計を眺めるのが趣味というのがありましたが、この眺める時間もUXで捉えることのできる部分です。「時間を知る」という利便性だけでなく、場合によっては眺めるためのデザインや高級感について考えるのもUXを考慮したモノ造りでは重要になってくるということです。

    上であげたように「誰が使うか」を考える必要が出てきます。
    これを考えるのに使われる手法が「ペルソナ」です。
    仮想の人格を作り上げてサービスを使う流れを考えていく方法ですが、中途半端な人格造りは役に立ちません。趣味趣向や年齢、性別を具体的に決めて、その人が喜びそうなサービス、その人が使いやすくするにはどのようにしたらいいかを本気で考える必要があります。

    人間中心のものづくり

    ものづくりやサービスを考えるときには、技術・人間・経済の3つの要素を考慮する必要があります。どれも重要でかけてはならない要素なのですが、UXでは人間から発想していきます。
    技術の面と、経済性からサービスを考えがちですが、それだと技術もすごくてビジネスモデルも素晴らしいが誰も求めておらず使われない。といったことになってしまう可能性が高いのです。
    まず、「人に求められているか」を考えたのちに、「技術的に可能か」「サービスとして成り立つか」を考えるのが正しい順序だと言えます。

    既存のサービスの改善を考えていく際も重要な考え方です。

    「❌ 少し使いにくくなるが、技術的にはこうしておいた方が楽」
    → これはとても危険な考え方です。

    実現が大変でも人間の使い勝手や感触を最優先にするべきです。
    「この場所にあれば構築が楽。」
    「サイズが変わった時に使いにくいが流れでこの場所に置いておく。」
    よくありがちですが、それは人間中心とは言えません。技術中心の考え方です。
    経済性(工数)が許す限りは最大限「人間中心」の改善を施していくべきなのです。

    技術中心のプロダクト例

    電力計

    代表的な例が古い電力計です。(UXの教科書より)
    こちらは、歯車によって構築されているため、出力結果の表示はアナログ時計のような形になっています。よくみてもらうとわかりますが、それぞれ針の回る方向が逆になっています。
    また、針が1と2の間にある場合に、向きが逆になっているのを考慮すると非常に数値の読み取りがしにくいものとなっています。
    訓練で身に付けることはできるかもしれませんが、デジタル表示のものと比べれば明らかに使いにくいものになっています。

    マークシート

    これは機械で読み取り安くするために、白抜き部分を塗りつぶすという方法です。技術中心の製品です。
    みなさん違和感なく使ってきたかもしれませんが、より人間を中心にしたものに変えて欲しいといわれれば問題点が浮かび上がり、案もいくつか浮かぶものと思われます。
    記述式というのもいいかもしれませんし、電子デバイスで入力するのも一つの解決法かもしれません。

    パノラマ機能付きのコンパクトカメラ

    融けるデザインで挙げられていた例です。
    「パノラマ撮影機能付き」とあって購入したデジタルカメラですが、実際使ってみるとパノラマにするにはPCを使う必要があったそうです。実際にパノラマ機能を使うことはなかったようです。
    この場合、とても意欲のあるユーザーや、必要に駆られてパノラマ撮影をしなければならないユーザーはその機能を使いますが、大半は使わずに終わることでしょう。
    対して、iphoneにもパノラマ撮影機能がついています。
    パノラマ撮影モードにして、カメラを横に動かすという使い方です。
    こちらの機能であれば、使いたいときにはこの機能を呼び出し利用することができます。

    機能を考えるときに考慮しなければならないのが、
    「技術的にできる」と「実際に人間がやる」は全く別物だということです。

    UXがなんなのかはわかった!
    でも具体的になにをすればいいの?

    UXという考え方に必要な「利用文脈」「人間中心のものづくり」については理解してもらえたと思います。(そう思いたい)

    では、具体的にどうやって「目的や問題を発見」し「問題を解決」するのか?
    こちらをこれから説明していきたいと思います。

    問題解決の手法は「コンサルタント」から学べ

    UXでは、少ない情報から「目的(問題)」を発見し「解決策」をすばやく提示する必要があります。
    実はコンサルタントの世界では手法としてある程度確立されています。
    UXを学びたいのであれば学ぶべきはコンサルタントの問題解決の技術なのです。
    ここからは役に問題解決に役に立つであろう問題解決の手法について解説していきます。
    こちらは手法の紹介にとどめ、詳しい解説については別記事にしていこうと考えています。

    ロジックツリー

    問題の原因と解決策をはっきりとさせるために、問題を図で分解する手法です。
    ダイエットを例にあげると、
    A子さんという女の子に「太っているから痩せたい」という問題があったとします。
    これを解決しようとしたときに「痩せるためにがんばる!」では具体的に何をしたらいいかわからず実際解決するとは思えません。

    分解すると痩せる方法は2種類ありそうです。
    A「運動する」B「食べ物を改善する」
    さらにそれぞれ分解ができそうです。
    A「毎朝走る」「腹筋をする」「スクワットをする」
    B「カロリー摂取を減らす」「糖質制限をする」「野菜を多く食べる」「油を取らない」
    図にすると以下のような形です。

    ここまでつくっただけでも、問題解決がかなりやりやすくなりました。
    A子さんは大の運動嫌い、「食べ物の改善だけ」で解決したい、となりました。
    そうなると「運動する」から先の部分はもう考えなくていいことになります。
    かわりに、「食べ物を改善する」の枝をさらに増やしたり、その枝をさらにさらに細かく分解して考えていき、毎食やることまで分解していくとより具体的な解決策を得ることができます。

    ちょっと待て、目的を疑え

    しかしいったん待ってみましょう。
    A子さんは本当に痩せる必要があるのでしょうか?
    こんな質問をぶつけてみましょう。
    「A子さんはなぜ痩せたいの?」
    するとA子さんは少し考えたのちこう答えました。
    「好きな男の子ができて、その子に好かれたいから」
    そうなると話は変わってきます。

    一つ上の目的が判明しました。
    その男の子が痩せているのが好きとは限りませんし、「会う回数を増やす」「おしゃれをする」などその他の解決法もたくさんありそうです。
    このように、高次の目的を見つけたり、問題を分割して具体的な行動案の作成につなげるのがロジックツリーです。
    特にUXでは「高次の目的を見つける」というのが非常に重要になってきます。
    一つ上の目的を見つけるのは「ラテラルシンキング」と呼ばれるものになります。

    So What ? (それはなぜ)

    質問する技術が非常に重要になってきます。
    根本的な目的や原因を突き止める方法として、So What?(それはなぜ)を何回も繰り返し問うという方法があります。
    これを行うことでなぜそう思ったのか対象が考えてくれます。それは本当の目的にたどりつくきっかけになります。
    上記の例でも、痩せたい理由が一つ上の階層にあると判明しました。
    これは自分に対して行っても有効です。

    仮説思考

    上記のように問題を分析するのはいいですが、いかんせん時間がかかります。
    限られた時間で成果を出すには「あたりをつける」という行為が必要になってきます。
    この「あたりをつける」行為は別に論理的でなくても構いません。直感や、過去の経験をフル活用して仮説を立てて問題ありません。
    デートでいく店を決めるときに完全に論理的なデータの積み上げによって決定しているでしょうか?
    パートナーの趣味嗜好や、その日の気分などを総合的に判断して決めていないでしょうか。
    その結果は、論理的な積み上げで導き出した場合の結果とたいして変わらないはずです。

    であれば、素早い分前者のほうが優れています。
    ビジネスになると、感覚をまったく重視せず論理を重要視する傾向があります。総当たりで情報を集めて分析し結論を導き出す手法です。「総花的な考え方」と呼ぶそうです。
    「十分な資料を集めてから考えたい」というときは総花的な考え方に陥っている可能性が高いです。注意しましょう。

    では、感覚で出した答えが間違っていたらどうするのでしょうか?
    コンサルタントの世界では、仮説の間違いが判明した場合、その方向で考えなくても良くなった捉えるため、まったく問題ないのです。
    仮説を検証し間違いが早めに判明するほどよいわけです。

    一つ上のダイエットの例でいくと、「運動する」を見込みなしと捉えた時点で運動という方向を深掘りしなくて良くなるということです。
    もし、会議で「ウォーキングという手もあるのではないか」という意見が出たとしても「それは運動にあたる。すでに検証済み」と判断を下すことが可能なのです。

    見込みがある仮説が立てられたら、それをロジックツリーで分析し、具体的な行動案を支える資料を集めましょう。
    この方法であれば、あらゆる資料を集め検証し答えを導き出すより格段に素早くことが進みます。

    ピラミッドストラクチャー

    ロジックツリーと形が似ていて、何が違うねん。と思ったものですが、これは最上部に結論がきます。
    そしてその下にその結論を支える理由をもってきます。
    そしてその下にはそれらを支える資料・理由・要素を持ってきます。

    これはどんなときに使えるかというと、最終的に出した結論が本当に正しいのか、どれだけ強い結論なのかを検証するのに使えます。

    そして、ここで作った表はプレゼンにそのまま転用可能です。
    いろんな本を読んで思ったのですが、ロジカルシンキングと問題解決の書籍は「いかに良いプレゼンをするか」が書かれています。プレゼンが不安でしかない人はこれらの本をかたっぱしから読むと自信がつくと思います。

    これらはロジカルツリーで考えたものを支えとしてもいいです。

    UXを考慮したサービスを1から生み出す手法「デザイン思考」

    上記の知識を基本として持っていれば、UXを考慮したサービスの発案や改善にかなり役立つと思います。さらにUXを考慮したプロダクトやサービスを生み出す手法として「デザイン思考」というものがありますのでこちらを紹介します。

    この記事程度でパッと説明できるものではないのですが、頑張ってみます。

    デザインという言葉が含まれますが、この考え方はデザイナー以外でも共通して使える考え方です。
    まず人間を観察し、人間が本当に求めていることを見つけ出します。
    この手法はIDEOというデザイン会社が考えたものだそうです。例を挙げます。

    ATMには周りを伺うためにミラーが付いていますね。
    このミラーも「ATMを使う人が後ろをきにすることが多い」という観察からIDEOがミラーをつけ始めたと言われています。

    普通に使っていて、「ATMにミラーをつけてほしい」などという客は一人もいないと思います。
    しかし、いったんミラーがつけばそれをユーザーは使い出し、自然なこととして受け入れます。
    このような表層に出ないが人々が欲していることを見つけ出すのが「デザイン思考」です。
    こちらの方法はいろいろなプロセスがあり、試作・検証・経済性の考慮などの手順があります。

    それらはすぐ簡単にできるものではありませんが、今すぐにでもその感覚を鍛える方法があります。
    自分もあらゆるもののユーザーでもあるので「不快感や違和感をみのがさない」ということです。
    それを感じたときに「なぜそう思ったのか」をしっかり分析する必要があります。
    (心地よいと思った、気持ちいいと思ったときにやっても良いかと思います)

    また、相手が喜ぶにはどうしたらいいかを考え、実際に喜ばせるというのも良いです。

    それが直結して、自分の開発しているサービスの改善にも繋がります。
    そういった普段の積み重ねがより良いアイデア発想に繋がることでしょう。

    利用文脈を知る

    UXに関連するいろいろな手法はここにかかっていると思います。
    何年もサービスを提供している人でも、以外とどんな経緯でサービスを使いどんなことを感じているのか把握していることは少ないと思います。
    UXはユーザーの観察や理解を深めることから始まります。
    どんな風に使うか、を把握するのに「カスタマージャーニーマップ」があります。
    サービス利用者をより深く理解するために一度作成しておくと、利用者の気持ちがより深く理解できるため説明書やマニュアルを作る際、はたまたサービスの購入をより便利にしたりなど、ユーザーの利便性を上げやすくなります。
    それがカスタマージャーニーマップです。
    その他の手法も「ユーザーについて深く知る」ということにつながるものだと考えます。

    またストーリーテリングの技術も必要になってきます。(自分は物語作成が重要になる仕事があるのかということに衝撃を受けた)
    利用文脈は物語にするとすんなり伝わります。
    間違ったことの誇張には気をつけなければなりませんが、効果的に利用文脈を伝えるにはストーリーテリングは有効です。試してみましょう。
    (LPサイトなどでみかける「お客様の声」はまさしくこれである)

    UXを導入するのは簡単ではない

    UXに理解が深い人など日本ではほとんどいません。
    製品開発に取り入れたいなどと言ってもなかなか難しいでしょう。
    しかし、UXなんてものは会社のような組織でないと全く必要とされないというのもまた真理です。個人でできるものではないのです。
    周りを変えるにはまず自分から、ということでできるところから始めていきましょう。
    上司や周りを説得するのも、上で挙げたプレゼンのための技術が大いに役立ちます。
    理解のある上司が権限を持っていれば、サービス開発にUXを取り入れるのはとてもスムーズに行くものと考えられます。

    みなさんがんばってください!

  • Oculus Questから覗く、VRの未来

    Oculus Questを買いました!

    今までのVRゴーグルは、PCやゲーム機などの本体と組み合わせる必要がありました。
    しかし、このOculus Questは単体で動くという特徴持っています。
    つまり、これだけ買えばVRを体験する環境が整っちゃうのです!

    Oculus Quest を楽しむために必要なもの

    すみません、嘘つきました。
    楽しむためにはいくつかのものが必要です。

    • スマホ
    • Wifiのネット環境
    • それなりのスペース
    • Oculus Quest

    スマホがないと使い始められないので注意。
    そして、VRコンテンツはゲームも動画も大容量です。全てネットから落とすことになるので、高速なネット回線は事前に用意しておきましょう。

    遊ぶ際のスペースも大事です。1✖︎1メートルあればとりあえず楽しめます。
    しかし、プレイ中は周りの環境がさっぱりわからなくなるので、できるだけ広いスペースを用意しておいたほうがいいです。

    追記:ガーディアンシステムという、設定したプレイエリアを越えると警告してくれるシステムがあります。広いところだと警告が少なくなるのでおすすめ。

    ノリノリでプレイしていると、思いっきり手足を動かしがちです。
    事故るとめちゃくちゃテンションが下がります。
    没入感の敵なので、適切な環境を準備しておきましょう。

    Oculus Quest 、どこで買う

    公式サイトかAmazonがよかろうと思います。

    Amazon
    https://amzn.to/2ldTfPl

    公式サイト
    https://www.oculus.com/?locale=ja_JP

    自分は、Amazonは割高な転売品しかなかったので、公式サイトで買いました。
    クレジットカードが必要かな?

    注文情報は英語での入力になります。
    住所を間違えて入力してしまい、一度キャンセルすることになったのですが、少しめんどくさかったです。
    問い合わせの項目から、「cancel」っぽい欄を選択して、メールする必要がありました。
    メールも英語じゃなきゃダメかなぁ、と機械翻訳して出そうと思ってましたが、これまた間違えて本文を日本語で送ってしまいました。
    でも、ちゃんとキャンセルできた上、日本語で返事が返ってきました。日本人のスタッフさんがいるみたいです。

    なんで買ったの?

    目が良くなるという噂を耳にしたからです。こちらの真偽は実際に試して報告したいと考えています!
    参考 → https://www.moguravr.com/vr-eyesight/

    しかも体感型のゲームが多いので体をうごかすゲームが多いです。

    つまり、まとめると
    Oculus で遊ぶと、「目が良くなり」「痩せる」「しかも楽しい」ということです。
    これって買わない理由ありますか?

    あと、Netflixの契約をしているのですがこのアプリもあり体験としては映画館のような環境で楽しめるとのことでした。(実際使ってみるとそんな感じです)

    ちゃんとした環境で見たい作品がある場合はそう行った用途にも活用できますよ!
    5万円程度ですが、体験の対価としてはぶっちゃけ安いと思います。

    単体稼働の製品なので、バッテリーさえ充電しておけばワイヤレスで楽しめます。

    使ってみた感想

    とりあえずデフォルトで入っているゲームと体験版を提供しているものと、「BEAT SAVER」を購入しやってみました。

    ゲームは、こんなに進化しとったんや・・・という感じです。
    独特な形のコントローラーを使うのですが、思ったより全然自由に動ける。レスポンスもとてもいいです。気軽に異世界にいけるって感じです。(これはガチよ・・・)
    顔や体を動かしても世界がちゃんとそれに付いてくる・・・全然ぶれないのはすごいな、と思いました。
    ものを掴むとか、銃で標的を打つとか・・・まじほんとマジです。

    上で少し述べましたが、動画を楽しむものとしてもなかなか優秀です。
    Netflixのほかにも、Youtubeなどをみることが可能です。
    Youtubeには、3Dのコンテンツがありそれをみることができます。
    動画はサイズの感覚が狂ってしまうことが多くて、自分が小人になってそこにいるような体験ができます。

    調子に乗って1日やってたんですけど、腕が痛くなりました。回復したらまたやる。
    ついでに頭もちょっと痛い。
    視神経の深いところを使ってる感じがすごくします。
    でも目が悪くならないならええやん?

    BEAT SAVERはほんと楽しい

    動画みて

    これ、超楽しいです。
    ダイエット目的で楽しみながらやりたいと思ってます。

    改善して欲しいところ

    この機器がおそらく最先端なので、以下の不満点を解消してくれる製品はまだありません。
    でも、だからこそ書いておきます。

    • 重すぎる。本体がふくまれてるからだというのはわかるがもう少し軽くなって欲しい。
    • 日本語で文字入力ができない。画面は日本語表示なのだが、入力ができない。
      キーボード使いたいっす。もしくは音声入力。
    • コピペができねぇ。初期iphoneかっつの
    • 顔に跡がつく。重いゆえに、ほっぺたに圧力がかかります。それが跡になるのがいやだ・・・。
      地味ですが→じゃあ控えようになるので改善して欲しい・・・
      剣道の面みたいにしてくれるといいのになぁって思います。もしくはフルフェイス
    • スポンジ部分がめっちゃ汗。体感型ゲームやってると汗かきますよね。
      交換が容易にできるようにして欲しい。スポンジのスペアが欲しい。
    • Netflixを寝ながら見たい。(天井に画面を持ってくモードがあればなー)
      VOID シアターモードってのがありました! → https://www.dream-seed.com/weblog/note/oculus-go-netflix
    • 解像度がたりない。普段動画みててもそんなこと思わないんですけど、VRはソフトもハードも解像度が高い方がいいと思います。特に動画コンテンツは全然解像度足りてないですね。くっきりはっきりさせたら本当に体験が変わると思う。期待してます。

    ダイエット / 目が良くなるか? を報告します!

    ほかにも楽しそうなゲームあるんですけど、今月流石にお金使いすぎたなーと思うので1月に1タイトル増やすぐらいのペースで買い足していこうかと思ってます。
    PS4は誰かに売ってもいいかも、と思っちゃいました。

    体重は現在 63 kg 体脂肪率 20%です
    視力は・・・zoffで作った処方箋があるので測りに行って結果を貰えば比べられるのかな?

    追記① ファイルの移動方法

    録画が簡単にできるんですが、ファイル移動がめんどくさい。

    https://ipod.item-get.com/2018/05/vroculus_gousb.php

    追記② よりフィットさせる方法

    頭の形があってないのか、自分の場合ベルト単体だとどうしてもフィットしません。
    タオルをかぶるといい感じにフィットしました。
    あせも吸い取ってくれるしいい感じです。
    ↓日本の知恵。剣道用の大きめの手ぬぐいが超ベストです。何枚か買っておきましょう。

  • ひとりぼっちの○○生活 アニメ感想

    4話ぐらいまでみました。

    あーこれいいっすねー。
    いいですねーってことを書くだけの記事です。

    概要

    主人公 ひとり ぼっち ちゃんが友達をたくさん作るために奮闘するお話です。

    好きなところ

    主人公がけっこうやべーやつです。←すごく好き
    基本的には優しい世界で、タイトルから想像される悲しい生活はありません。←すごく好き
    ときどき挟まれるギャグのセンスがすごく自分好みです ←すごく好き
    声優さんのぼっち声がかわいい ←すごく好き

    日常系って割と自分に合わないことが多くて、見るのやめることが多いんですが、
    この作品はすごくみてて心地よいです。
    うまく言語化できないんですけど・・・・

    上記が言いたかっただけです。
    ジャンルで選り好みせずに色々みてみるのは大事だなーって思いました。

  • プロメアをみてきたよ

    結論から言うとすごく良かったです。

    良かったところ

    見所から言うと、アニメーション表現です。
    3Dを多用してるのですが、違和感がものすごく少なく2Dと馴染んでいます。
    うまく言えませんが、塊魂の表現に近いのかな、と思いました。
    トリガーは度々表現を発明していると思うのですが、今回は炎「プロメア」でしょう。
    ビビッドな緑と紫?で描かれる炎はとってもポップです。多用されています。
    キルラキルのキラキラ表現も発明の一つですね。(今回も使われてました)
    そして動く動く。アニメーションが動いてるのが大好きな人が一番楽しめるのではないかと思います。

    キャラクターについても、スター制度を採用しているようで、既視感のあるキャラクターしかいません。
    トリガーにはこれを期待している!というストーリーの流れをそのままやってるのも正しい感じがします。

    てな感じの作品でした。

    悪かったところ

    まー既視感があるところですよね。
    キルラキルとグレンラガンくっつけたみたいな作品でしたね。
    (それを見に行って、見れたから満足だが)

    声優に関しては普通の俳優さんが多く参加してるんですが、皆さんお上手ですね。
    でも正直この作品に関しては過剰なぐらいの演技でいいと思うんですよね。ちょっと正直物足りなかったところは・・・あるよ?

    あとテレビアニメと比べると、長いのでちょっとダレるところはあった。

    作品についてじゃないけど

    最近いろんな作品が手軽に見れるので、浴びるように見ている。
    だからかもしれないが、一つ一つに感じる感動が薄くなっている・・・。
    今後そう言う人間が増えていくんじゃないかな。
    (年齢もあると思う)

    周りの若い子たちの方が絶対感動してたし、楽しんでたよな。映画終わった後に聞こえてきた声により・・・
    冷めた目で俯瞰的に見ているじぶんが申し訳ない。高二病というやつです。

    本読んでる方が、発見や気づきが多いので映画を見るより本を読む方に出来るだけ時間を割いた方がいいのかな、と思います。
    あとVRゲームをやりたいんですよね。(すぐ飽きそうですけど)
    あと、こういった作品はプロフェッショナルな人たちが作っているので遠く及ばないと承知しながら書くのですが、「じぶんが面白いと感じるもの」を作ることに挑戦するしかないのでは?と思っている。
    実際できるかどうかは置いておいて、それに取り組む時間はきっとたのしそうなきがする。

    おわり。

  • GW まじで何一つやることがない…せや!ゲームを作ろう!

    ということでゲームを作ろうと思います。

    (完成したゲームはこちらです↓)

    https://tlog.work/game/

    積んでいるゲームがあるんですけど、全然やる気になりません。
    たぶんゲームというものに飽きてしまったんでしょうね。
    でも、ゲームを作る気力はあります。不思議なものですね。

    どんなゲームを作ろうか

    作るゲームについて考えたいと思います。
    制作するゲームジャンルは、ノベルゲームか脱出ゲームにしたいと考えています。
    ノベルゲームは当たり前ですが、ストーリーを考えなければなりません。
    脱出ゲームにもストーリーは必要だと思いますが、ノベルゲームより楽そうな気がします。

    • 閉じ込められる舞台
    • 閉じ込められた理由
    • 主人公の設定
    • 閉じ込めた人の設定
    • ギミック

    これぐらい用意しとけばいい感じ。
    素材の関係で必然的に「自分の部屋」が舞台になりますね。
    じゃあ閉じ込められたのは自分でいいや。
    閉じ込めたのは大家さんでいいや。
    閉じ込めた理由・・・うーん。家賃を払わなすぎた腹いせってことにしておこう。

    決まりました。

    • 閉じ込められる舞台 「自分の部屋」
    • 閉じ込められた理由 「家賃を払わなすぎた腹いせに封印した」
    • 主人公の設定 「30代の男性 (記憶喪失)」
    • 閉じ込めた人の設定 「部屋の大家」
    • ギミック → これから考える

    ゲームをどうやって作るか考える

    脱出ゲーに関してはUNITYを勉強しようかと思っていた時期に買った本のサンプルとしてあったので、何となーく仕組みを覚えています。

    当時は、いろんな技術を勉強しよーってことでいろいろな勉強をしていたのですが、そこから私も意識が低くなり、UNITYエンジニアななることはなそうですので自分がやりやすい技術を総結集して作成したいと思います。

    具体的にはHTMLで画面を作成したいと考えています。
    canvasも使いません。
    HTMLの要素で全てをやろうとすると慣れた技術で全てできるので非常に気が楽です。

    • HTML
    • CSS
    • JS / jQuery
    • ajax ( jQuery )
    • PHP
    • MySQL(使わないかも?)

    データベース作るのがめんどくさいので、なくて済むなら作らない方向でやりたいと思います。
    localstorageとかでいけるかもしれんね。

    脱出ゲームについて考える

    脱出ゲームにおいては、まず画面を作成する必要があります。
    ・最低でも4面 詳細画面を作成
    ・画面切り替えの仕組みが必要

    アイテムのデータ保持が必要 「使う」的な機能を持たせている場合も多い。
    まぁでもこれぐらいだろうか。
    スマホ対策とか考えるとちょっと難易度が上がる。
    スマホでは横にしてもらうとして、横画面で作成してみたいと思う。

    ゲーム目的から逆算して仕組みを考えてみたいと思う。
    ・ゲーム目的は自身の脱出。

    ・ドアを開ける必要がある

    ・ドアを開けるには鍵がいる

    ・鍵は金庫の中に隠されている

    ・金庫を開けるには暗証番号が必要

    ・暗証番号は棚の中に隠されている

    てな感じに作ってみたいと思います。

    画面を作成する

    いきなりたくさんの画面を作るのは難しそうなので、2画面ぐらいにしてみたいと思います。

    中略

    できたゲームです↓

    https://tlog.work/game/

    上記のようになりました。
    こんな辺境のプログラム、なかなか遊んでもらえないと思ったのですごく簡単にしてあります。
    以下攻略

    ①本棚を確認して合言葉を探ります。
    ②金庫をクリックすると合言葉入力画面が出てきます。
    ③「ひらけゴマ」と入力します
    ④鍵が手に入っているので、ドアまでいけばクリアです

    結局

    つかった技術

    • HTML / CSS
    • jQuery(ajax)
    • sessionstorage

    これだけですみましたね。
    画面の構成を作るファイル、テキストのファイルを用意しておき
    クリックで読み込む仕組みにしてあります。
    出来るだけ読み込む方に情報を持たせるようにしました。
    それにより、画面を割と簡単に作れるようになっています。

    なんか、あの、探索して裁判に臨むゲームに近いものもこの仕組みで作れそうな気がしてきました。
    ちょっと試してみようかなと思います。

  • ipad は次世代を担う端末だ!あと導入ソフトまとめ

    ipad を購入ししばらく経ちました

    導入したソフトと、いろいろなレビューをしていきたいと思っています。

    https://japanese.engadget.com/2019/04/01/ipad-air-pro-air/
    上記のレビュー記事が非常に参考になると思います。

    購入したのはairで容量は64GBです。
    そりゃproでmax容量の方がいいと思いますが、macbookproをもってるので一番やすいやつにしてますね・・・。

    ipad はかつて「閲覧専用」の道具だった

    Ipadは動画、書籍などメディアを閲覧するにはこれ以上ないほど便利で快適なものでした。
    デメリットといえば、スマホより重く、固定するにはなんらかの道具を組み合わせる必要があること。
    なにかを作り出す、例えば絵を描いたり、コーディングしてプログラムを生み出すことには使えない代物でした。
    なにかを作り出すにはパソコンを使う他なかったのです。

    いまのipadは明らかにパソコンを超えた

    ソフトウェア面で、対応していないアプリケーションはあると思いますが今のipadはハードウェア的にパソコンでできることのほとんどは可能になっていると思います。
    それどころか、デフォルトの状態でタッチパネルを装備し、画面にペンで書き込める機能をサポートしています。
    PCではマウスとキーボードとタッチパッドとペンタブとタッチぱネスがちぐはぐに共存していましたが、ipadは(マウスはないですが)それらが基本で装備され、それを前提にしたアプリケーションが搭載されています。

    たしかに今は発展途上で過渡期である

    OSやアプリケーションはまだ発展途上でPCに追いついていない部分があります。
    しかしこれからは明らかにipadの方がメインストリームになっていくと考えられます。
    だからこその「ipad pro」なのです。

    アウトプットをし倒せ!

    スマホは手軽だが画面が小さく、なにかを作り出すには足りない(ただし性能的には十分)
    PCは入力システムが充実し、なんでもできる。しかしながらゆっくりと落ち着ける場所でしか利用することができない。

    その点ipadは電車の中で利用しても自然ですし、完璧にサポートされたキーボードもアクセサリで準備されている。
    ペンで絵を描くこともできるし、動画・写真も高性能なカメラを搭載しており実際の使用に耐えるものが作成できる。また、マイクに関しても実はかなり高品質であるらしい。

    そう、すごくちょうどいいのだ。
    PCの利点は、ものすごく処理能力が必要なことをしない限りはない。
    具体的には映像作成、3Dデータの作成処理、ものすごい最新のゲームぐらいである。(ipadもかなり高性能になりつつあるので、この辺もいずれ解消されることだろう)

    インプットに優れていることが敵

    最初に述べたが、メディアデータの再生にこれ以上ないほど適している。
    だから、何か生産的なことをしたいと考えている人にとっては、そういったことに時間を取られて制作を怠るというのが一番よくないパターンだと思われる。

    個人的には、PCよりその誘惑に負けることが少ないと感じる。
    映画やアニメを見る時は集中してそれだけするし、書籍や漫画もそれだけを集中して楽しめる。
    何故だろうか。この辺の気づきも使ってるうちにわかればブログ記事として載せたいと考えている。

    写真の作成はiphoneで行いたい。それすごくスムーズです。

    そもそもipadで撮影すれば良い。proならすごく高品質な画像を撮影できる。
    でもiphoneの画像を使いたいこともある。写真の利用もとてもスムーズだ。フォトストリームを利用しているひとはそれで済むのだろうが、自分はクラウドの容量を気にして利用していない。
    その場合もAir Dropがスムーズに使えるのですごく楽だと思った。

    買うならアクセサリもセットで

    何か創作するために購入したいなら、アクセサリもいっしょに購入しよう。
    ノートを取ったり、絵を描くのならばapplepencileは必須だ。
    そして、PCでの入力に慣れているならば純正のキーボードを必ず買おう。
    サードパーティ製のものは充電が必要でJISキーボードがないことがおおい。
    節約して使いにくいものを買うより、もとからセットであると認識した方がよい。
    ちなみにairのキーボードの機構は結構変わっており、通常の収納時にタッチパネル側しか保護しない。ケースにはならない。
    逆を返すと、好きなケースを利用できるとも言える。
    自分はタッチパネル側にもなにも貼らないし、背面もむき出しである。
    そもそも売る気はなく、数年間使い倒してやろうという心意気の反映である。(その分大事に扱うけどね)

    導入したソフトをご紹介

    MWeb

    markdownで記述できるエディターです。(有料)
    Iphoneで利用するために購入したソフトだが、そのままipadでも利用することができた。このエディターは設定しておけばワードプレスにそのままアップロードできるという特徴を持っている。
    キーボードと組み合わせるとすごく違和感なく使える。
    ネットに繋がっている環境であれば、WEB管理画面もわりとちゃんと利用できるので、非公開でアップロードして、WEB画面側で足りない部分を修正するというのが現実的な利用方法だと思う。
    アイディアをローカルに溜め込んでおく時にも使えると思う。

    photoshop sketch

    このソフトはほんといいです。気持ちのいいようにかけます。
    有料ソフトを試す前に一度これを試してみることをお勧めする。
    メモアプリもけっこう好んで使っているのだが、ノートとして使う場合は自分はそちらのソフトで十分だと思っている。

    Textastic

    HTML等を編集するために導入したソフトだ(有料)
    Codaと迷ったのだが、こちらに乗り換えたという記事があったのでこれにしてみた。
    (Codaは買ってないので使用感がわからない)
    ちょっとしか使ってないが特に不満はなさそうな感じがする。
    FTP機能が付いているのが個人的なおすすめポイントだ。
    ローカルに落としてきて、編集してアップロードという作業が自然に行える。

    Gキーボード

    Google日本語入力だ。
    物理キーボードで入力するときははっきり言って邪魔なのだが、キーボードなしでフリック入力するときはこちらの方が使いやすい。
    デフォルトキーボードをセパレートしないとかな入力からフリック入力にならない。
    かな入力とフリック入力は別物であるので、分けて欲しい。分けて欲しいよ!!!

    以上です

    iPadを利用してしばらく感じたことを記載してみました。
    しばらく使ってみて、他に感じたことがあればまた、新たに記事を追加できればいいなと考えています。
    皆さんもぜひipadを導入して創作的な日々を送っていただければと思います。

  • 東京の一人暮らしで気をつけたいこと 電車・勧誘篇

    東京で一人暮らしするときに注意しなければならないこと

    アジア系の日本に勉強にきているっぽい外国人グループが、公園にいたのですが、おっさんから話しかけられていました。
    日本にきて、知り合いもいないだろうしいいことだなーと思って微笑ましいなぁと思ってこっそり聞き耳をたてていました。
    しかし

    宗教勧誘が始まった

    近くで集まりがあるから来てくださいね!という勧誘が始まりました。
    そこまで仲よさそうに話していたのに、グループで公園で休みに来ていただけだろうに、微笑ましい空気が(個人的に)一変したエピソードでした。
    となりにすわっていた自分は、密かにその場を離れました。

    話しかけてくるやつは基本的にやべーやつである。

    まじめに宗教勧誘してると思うんだけどごめんね。勧誘される方はすごく嫌な気分になるんだわ。
    自分も隣の人に突然話しかけられたことがある。
    なんとなーく察したのですが、「ネットワークビジネス」とか「マルチ商法」系の勧誘だったのだと思います。
    連絡先を交換してしばらくメッセージやりとりもしていたのですが、なんとなく違和感があり連絡を断つようにしました。

    カフェ、ファミレスの2人席の人たちをよーく観察してみよう

    都心のカフェでなんとなーく仕事や書きものをしに行ってみましょう。
    そしてついでに、隣の「始めて会う仲がそんなによくなさそうな二人組」に注目してみましょう。
    保険勧誘だの、インベスターになりたいだの、僕はこんな経歴があってこんなにすごいだの、ブログで炎上記事を書いてアクセス数を稼ぐには・・・だの、怪しい話ばっかりしてます!
    まぁ、自分も経歴話すとわりとそういう怪しい人たちに近い立場にいる感じはしますが・・・。
    突然の連絡と、食事をしましょうには十分気をつけようね!

    寸借詐欺にも気をつけよう

    駅で「お金ないんです1000円貸してください」これ寸借詐欺です。
    フィリピンから日本に勉強に来ています。募金してください。これ大抵詐欺です。
    海外から来ました。これ自分の国の工芸品です買ってください。
    アンケートに協力してください。→アンケートする。そのご冊子を取り出し、これ500円です買ってください。
    お店お探しですか?→ぼったくりに連れてかれる
    予約した店の前で→ 手違いでいっぱいみたいです。系列店にご案内します。→すべて嘘でぼったくりに案内される。

    話しかけてくるひとだいたい自分の利益にならないから気をつけてね!

    突然の訪問はだいたいよくない客

    セールスだったり、プロバイダ変えませんか?だったり、NHKだったりします。
    NHKはテレビ持ってたら加入しないといけないんですが、テレビ持ってないのに
    「ちょっとまずいです、連絡が入ってるんで加入急いでください」みたいな脅迫まがいするから嫌い。テレビ持ってないっつーの。

    テレビ持ってなくても加入できちゃうし、契約するとお金は払わなくちゃいけないので契約したらちゃんとお金は払おうね。

    テレビ・ワンセグ持ってないなら絶対契約しないようにしよう。

    電車内で快適に過ごす方法

    電車では立ったほうが快適だったりします。隣のひとと肩がぶつからないからね。
    ジムに通ってるような人は座らないようにしましょう。座ってるよりトレーニングになります。
    座り席への執着をやめると気持ちが楽になります。
    また、入り口付近は混みやすいです。近い駅で降りたい人は中央まで入るのを嫌がるからです。
    激込みのときでも、入り口から最も遠い場所は意外と快適だったりします。
    また、「この人やばいなー」と直感で感じたらできるだけ離れるようにしましょう。
    そういう人を観察したいという好奇心があったりすると思いますが、その時点であなたは当事者になる可能性が跳ね上がりますでトラブルがあった場合に被害者、その他になる可能性があります。

    また、 悪意を向けられた際に対象に執着しないというのも大事です。
    たとえばぶつかられた時にムカッとして、「復讐してやる!」と思ってしまうのが人間です。
    でも一度立ち止まって考えてみましょう。
    ・その人とはもう二度と会うことはありません。
    ・そんなひとに仕返しをするリスクをよく考えてみましょう。割に合いますか?
    ・持つべき感情は怒りではなく、今後もトラブルをどこかで引き起こすであろう他人への「憐れみ」と「関わらないようにしよう」という心です。(もっと踏み込んで言うと生理的嫌悪)
    ・「イラっとして仕返しするだろう」という期待をしてやっているはずですので、期待に答えず目すら合わせず、無視してやりましょう
    そんなどうでもいい人のことは放っておいてさっさと離れましょう。
    あと、自分が加害者にならないように気をつけるのも大事ですね。

    荷物が周りにぶつかっていることはよくあります。網棚にあげるか、リュックやトートバッグは前に抱えるようにしましょう。

    混み具合と時間、車両をメモして蓄積しておく

    混み具合をメモしておくのは非常に有用です。
    車両・乗り場所、時間帯をちょっとずらしたり、上で触れた車内で最も空いている場所を探すと非常に快適に過ごせます。

    大体の場合、人が自然に行きやすい場所・・・を外すのがいいです。
    階段を降りてすぐの場所は混むと思いますので、そこから一番遠い場所にしてみるとか、特急・快速が混むなら各駅停車に乗れないかとか。
    一周している路線なら逆方向に乗る方法はないか・・・などです。

    始発車両の椅子取りゲームは、真ん中の遠い座席を目指して座る人が多いです。だがしかし、一番近い席をめがけましょう。脇の席です。
    それが空いていなければその隣です。決して、端から一つ開けて・・・を考えるのはやめましょう。どうせ埋まるのですからより近いところ一択です。

    新幹線の場合、自由席なら一番遠い車両を選ぶと一番空いています。
    トイレがない場所が席が多いらしいですが、個人的にはあまり関係ないと思っています。

    また、営業とかの人は駅の出口との関係をみて乗り場所を選ぶようですね。そういう個人的なノウハウを蓄積しましょう。

    あと、行動原理としては「いかに素早くつけるか」ではなく「ストレスフルな車内をいかにストレスなく過ごすか」のほうがいいと思います。
    前者を目指すと必然的にイライラします。
    「混み合った階段前で人を押しのけたくなる」という合理的でない衝動にかられます。
    やってみると分かりますが、それは混んでいる場所を抜けたあとにちょっと早歩きすれば追い抜けます。
    また、一つ前の時間の電車に乗ることで全く追い抜けない差をつけることが可能です。
    そういう短絡的な時間短縮はストレスが溜まるだけなのでやめたほうがいいです。混んでる階段ぐらいゆっくり落ち着いて待ちましょう。

    6月の電車で遭遇する悪臭の原因

    洗濯物を干さずに長時間放置してしまったり、部屋干しで長い時間濡れたままにしていると菌が湧いてものすごい匂いがします。乾くと匂いが消えますが、着ていると汗で匂いが復活します。
    電車内や職場で発動するのでマジで気をつけてください。
    漂白剤(または熱湯)で殺菌・抗菌ができます。
    部屋干し用や、柔軟剤に抗菌・殺菌と書いてあるものを選びましょう。
    ズボラな人はほんと気をつけようね!

    とりあえず思いついたのはそんなこと

    けっこう有用だと思うんですよね。また思いついたら他の記事でちょくちょく書いていこうと思っています。

  • 行動経済学見るだけノートがかわいい!

    今回紹介する作品

    行動経済学見るだけノート

    真壁昭夫実用書(経済学)★★★★

    作品の感想

    行動経済学の内容がわかりやすく図解されている本です。おすすめです。物を売る仕事をしている人、使い勝手について考えなければならない人、はたまた、日々の生活でだらけた生活を改めたい人にも役に立つことうけあいです。

    一番心に残ったシーン

    ホモ・エコノミカスという、空論上の人間が出てくるのですが、自分はこれに近づきたいのかもしれないと、少し思いました。人間としての魅力にはかけるのかもしれませんが。きっと東大入るような人はこのような人間に近い行動をとっているのではないかと推測します。

    まとめ

    絵が可愛く、しかもわかりやすい。内容もすぐに実生活に役立つような事柄が多く記載されていますのでおすすめです。

  • 技術書典に参加してきました

    技術書典池袋 サンシャインシティ展示ホール技術書オンリーの同人誌頒布イベント★★★★

    イベントの感想

    ニッチな本がバンバン売れているのを見ることができました。是非、売る側で参加したいなぁと思いました。

    一番心に残ったシーン

    11時に入場して並び始めたのですが、めちゃくちゃ長い行列で30分ぐらいは全く動きませんでした。また、有料で1000円でした。わかってましたし、混雑緩和には全く影響がないシステムに感じました。

    まとめ

    ・売る側で参加したいなぁ

  • ブログ記事を量産するプログラムを作成しました

    今回作ったもの

    記事をナチュラルに作成するプログラムです。決してスパム記事を作成するものではありませんよ!

    利用した技術

    HTML php

    作成したものについて

    まだ解説できるレベルではないので、試験運用中といったところです。もうちょいクオリティを上げてから紹介できたらいいな、と思ってます。簡単に言うと、対話式のフォームです。思ったとおり自分にあってるので記事をガンガン量産しています。しばらくクオリティは低いでしょうが、その辺の精度やクオリティもそのうち上がっていくと思いますのでご期待ください。

    工夫したところ

    対話式であることです。普通にブログを書くと、言葉が出てこず悩むものですが、対話式にすることによりスラスラと言葉が出てきます。しばらく自分で使ってより良く改善していこうとおもっています。

    参考サイト

    この前投稿した、WordPressへポストを送って投稿する方法を非常に参考にしています。また、Slackでやろうとしたのでそのへんも参考にしようとしましたが、結局普通のhtmlで作成したので、あんまり参考にせず自力で頑張りました。ajaxのフォーム送信も参考にしましたが、過去このブログで紹介しているような気もします。

    まとめ

    対話式のブログ投稿フォームを作成し、現在し検証試用中です。より良いものになれば、次に展開できたらいいなと思っています。もしかしたらブログ投稿という方向性ではないかも。

  • デザイン業務の処方箋!あるあるデザイン

    今回紹介する作品

    あるあるデザイン

    デザイン実用書

    ★★★★

    作品の感想

    デザインサンプル例みたいな本です。とりあえず迷ったときに見ると非常に参考になると思います。

    まとめ

    デザインの作例をわかりやすくジャンル分けしてまとめてある本です。

  • 君たちはどう生きるか

    今回紹介する作品

    君たちはどう生きるか

    吉野源三郎

    漫画

    ★★★

    作品の感想

    子供に人生観を考えさせるには良い本かもしれないと思った。

    一番心に残ったシーン

    友人裏切りのジレンマみたいなものは生きてく上で必ずぶつかるものだな、とおもう。

    好きなキャラクター

    コペルくん

    まとめ

    人生を考えさせる本でした。でも、文字読ませる部分がちょっと多かった。

  • ケムリクサの感想も一応書いておくよ!

    今回紹介する作品

    ケムリクサ

    オススメ度を5段階評価!

    ★★★★★

    ジャンル

    テレビアニメ

    よかったところ、役にたったところ!

    やはり最後である。余韻の残るアニメはとてもいいです。最初はオリジナルだし、やっぱり一般的なアニメと比べると映像の質は低いと言わざるを得ない。だがしかし!そんなのは些末なことなのだ。作品にかける情熱が伝わってきたし、書きたいものも伝わってきた。キャラクターをどんどん好きになってくるしすごいと思いました。

    心に残ったところ

    赤い草を作り出しちゃって世界が破滅する感じ。あれすごく怖いと思いました。

    まとめ

    たつき監督の次回作にも期待してます!!

  • ドラゴンを銃で撃退 GATE 自衛隊 彼の地にて、斯く戦えり

    今回紹介する作品

    GATE 自衛隊 彼の地にて、斯く戦えり

    オススメ度を5段階評価!

    ★★★

    ジャンル

    テレビアニメ

    よかったところ、役にたったところ!

    軍事オタクも、ファンタジー好きも楽しめます。異世界側が割と弱いので俺つえーな楽しみ方ができます。

    心に残ったところ

    Fantasyなおんなのこと、リアルな自衛隊の人が一緒にいる感じがいいですね。あんまり脅威を感じないところがちょっと残念かなあ。ミストって作品と同じような設定。あっちの方が怖くて性格が悪いです。

    まとめ

    絵がきれいでファンタジーで、銃をバリバリ打つので何も考えず見れるかなーと思ってます。隊長の仕事できる感じは見習いたいなーと思いました。

  • Amazonの哲学

    今回紹介する作品

    Amazonの哲学 (桑原晃弥)

    オススメ度を5段階評価!

    ⭐️ ⭐️ ⭐️

    ジャンル

    実用書 文庫本

    よかったところ、役にたったところ!

    客のためには尽くしすぎることはない、という考えそして利益より投資と成長を重んじるというのは面白い考えだと思った。時には自分を食うというのが非常に参考になった。

    心に残ったところ

    今はスピードが非常に大事だということ。早く回るこの世の中では20分ですら遅いということ。焦ります

    まとめ

    アマゾンの考え方がまとめられており、自分の活動や、仕事にも活かせることが乗っていると思います。ぜひ読んでみてください。

  • 響け!ユーフォニアムの劇場版を見てきたよ

    今回紹介する作品

    劇場版 響け!ユーフォニアム ~ 誓いのフィナーレ ~

    オススメ度を5段階評価!

    ☆☆☆☆

    ジャンル

    劇場アニメ

    よかったところ、役にたったところ!

    今回の主人公の女の子が非常にひねくれていて、それが今作の盛り上がりポイントで非常に生きていてよかった。

    心に残ったところ

    劇場版アニメはだれてしまうことがけっこう多いですが、今作はそれがなかった。ちゃんと盛り上がるところは盛り上がり、飽きさせる事がない。主人公も恋愛で悩んでいたり普通の人っぽい風を装い密かに狂っているところももっている。そいういう表現がこの作品の魅力だと思う。

    まとめ

    殺伐として、リアルで、他ではあまり見られない空気である。こんな作品を作ってくれてありがとうございます。

  • プログラムでwordpressを投稿する方法(Gasとも連携できる)

    結構簡単にできることがわかりました。
    post通信についても少し理解が深まりました。

    イメージはこんな感じです。まず、記事を追加するPHPファイルをサーバーに設置してやる必要があります。やりようによってはすごくセキュリティホールなので気をつけてください。

    まず、phpファイルにアクセスすると記事が投稿されるようにしておきましょう。

    投稿用PHPファイルの設置

    https://9-bb.com/wordpress-14/

    上記の記事を参考に。

    include_once("C:/XXXXXXXX/wp-load.php");
    
    
    $my_post = array(
    'post_title' => 'My post',
    'post_content' => 'This is my post.',
    'post_status' => 'publish',
    'post_author' => 1,
    'post_category' => array(1)
    );
    
    $post_id = wp_insert_post( $my_post, $wp_error );
    echo $post_id;

    この内容のPHPファイルを設置します。
    そのPHPのURLを打ち込むとPHPが動作し投稿されます。

    次にGasでそのURLに向けて、HTTPのpostを行います。

    投稿データをPHPファイルに送る

    http://shinsuke789.hatenablog.jp/entry/2015/01/03/164203

    上記の記事を参考に・・・。

    PHPの方では

    $submit = $_POST["submit"];

    てな形で扱えば送ったデータが利用できます。

    Postする情報を投稿のためのデータにしておけば、Post先のファイルで情報を加工して記事ができちゃいますね。

    アイキャッチを投稿する

    https://blue-bear.jp/kb/wordpress-%E3%83%97%E3%83%AD%E3%82%B0%E3%83%A9%E3%83%A0%E3%81%A7%E8%A8%98%E4%BA%8B%E6%8A%95%E7%A8%BF%EF%BC%8B%E3%82%A2%E3%82%A4%E3%82%AD%E3%83%A3%E3%83%83%E3%83%81%E7%94%BB%E5%83%8F%E7%99%BB/

    それについては上記の記事が参考になりそうです。

  • アイパッドから投稿テスト

    ipadを購入しました

    ついに購入してしまいました。

    ブログの作成テスト

    ipadを購入したので、ブログの投稿を試してみます。
    果たして使いこなせるでしょうか?

    文字の入力はそこまで便利ではない感じがします。
    キーボードも合わせて購入しましたが、まだ届かないようです。
    画面上で入力する場合、フリック入力はさほど便利じゃない感じがします。
    そこそこの広さがあるので、まあ、そこそこの入力しやすさを誇っています。

    でもなんだか使い心地に違和感があるので、やっぱり物理のキーボードが欲しいです。

    便利なところ

    動画を見ながら作業ができます。
    複数のアプリの切り替えが非常にやりやすいです。

  • slack用の翻訳アプリをgasで作る

    久々の投稿です。

    職場にバングラ人がいて、slackを導入しているのでこりゃ作るしかないと思ったのでつくりますまる

    スプレッドシートを作って、スクリプトエディタをひらきます。

    function postSlack(text){
      var url = "https://hooks.slack.com/services/xxxxxxxxxxxxxxxxxxxxxxxxx";
      var options = {
        "method" : "POST",
        "headers": {"Content-type": "application/json"},
        "payload" : '{"text":"' + text + '"}'
      };
      UrlFetchApp.fetch(url, options);
    }
    
    function doPost(e) {
      var message = "こんにちは " + e.parameter.user_name + "さん";
      var message2 = e.parameter.text;
      var Sheet = SpreadsheetApp.getActiveSheet();
      Sheet.getRange("A3").setValue(message2);
      var trancelateJa = Sheet.getRange("A2").getValue();
      var trancelateEn = Sheet.getRange("B2").getValue();
      var trancelateBg = Sheet.getRange("C2").getValue();
      postSlack(trancelateJa + "\n" + trancelateEn + "\n" + trancelateBg);
    }

    レイアウト適当ですがA3が生データ B3が起動語を抜いたもの
    上3つがB3の翻訳結果です。

    A2
    =googletranslate(B3,"ja","en")
    
    B3
    =SUBSTITUTE(A3,"[trancelate]","")

     関数はこれだけっす。翻訳の関数があるのがgoogleスプレッドシートの大きな利点。
    gasの方は
    ・メッセージを取得
    ・セルに書き込む
    ・セルからデータを取得してslack送信
    そんだけ。
    アプリケーションとして公開する必要があります。
    権限許可も必要です。びびりながらやってください。

    slackの設定

    Slack botGASでつくる方法で一番楽そうなやつ

    https://vaaaaaanquish.hatenablog.com/entry/2017/09/27/184352

    上記の記事の設定をしていくといいです。
    おわりっす。
    起動語は[tlancslate]にしたけど、普通にユーザー@がいいかも。
    スプレッドシートで起動語削除処理がありますが、これを忘れると処理がループするので注意。

  • mwebエディタでスマホからブログを投稿しよう!

    ライフスタイルが変わって、個人パソコンを触る機会が激減してしまいました。
    大好きで愛着のあるmacなので悲しいところではあります。
    そのかわり、iphoneで色々やることが増えましたので、iphoneをメイン機と捉え、色々組んでいこうと思いました。

    まず、試そうと思ったのが、「mweb」というエディタの導入でした。

    エディタ「mweb」

    マックとiosに対応したエディタです。
    特徴としては、markdown記法を採用しています。
    さらに、課金(1080円)すれば、ワードプレスに直接投稿できる優れものです。

    どちらかというと、アプリに課金するのを躊躇するタイプなのですが、ノータイムで買っちゃいました。
    あれこれ悩むより、さっと買って試した方が時間のロスが少ないな、という判断です。

    あと、サブスクリプション形式でなく、買い切りであるのも大きいです。
    あまり好きじゃないんですよね。
    1000円で映画見放題ですから、それと比べて毎月お金を払い続ける価値はあるのか、という判断基準で買うか否かを判断します。

    ブログに関してはもともとサーバー代を払ってるものですし、ブログ関連でお金をさらに払うのはちょっと躊躇しちゃいますよね。

    ただし、買い切りならオーケーです。

    この記事もそれでかいています。

    マックと比べると流石に指一本でチマチマと文を撃ち続けるのは疲れます。
    でもまあ、あまりストレスなく、パソコンを取り出すほど大げさでもないので、すごくいい感じで執筆できています。

    ライフスタイルに合わせた変化を

    家の中では、もう休むモードになってしまって、なかなかブログを書く気持ちにならなくなっちゃったんですよね。
    特別に書く時間を用意してやる必要があります。
    電車での通勤時間というのもいい手に思えますが、朝の混雑中にスマホを撃ち続けるのはなかなかの難易度です。

    朝できるのはどちらかとインプットの方ですね。映像見たり、ニュース記事を読んだり。

    意図的にカフェに入ったりする必要がありそうです。

    自分の生活だと、帰りの電車は結構座ることができるので、この時間を有効活用して記事を書いていこうと思います。

    そのほかにも、意図的に時間を取ることが出来ないか、いつも考えながら生活してみようと思っています。

    ここまで書いてみましたが

    ブログエディタ、かなりいい感じです。
    普段のメモでも結構使いやすそうなので、iphone付属のメモからこちらに一部乗り換えるのも悪くないかもしれません。
    markdownとブログに投稿のきのう着いたら、すごくメモが便利になりそうですが、まぁ無理かな。

    markdownで木になることをメモしておき、コピペでこのエディタにうつしてから記事を
    書き始めればいいのかもしれませんね!

    さて、しばらくブログをスマホで入力習慣(週間)を実施してみますよ!

    結果は乞うご期待!

  • Mwebアプリからの投稿テストです

    試しにiphoneからブログ投稿してみます。

    テキスト見出し

    テキスト見出しその2

    画像投稿テスト

    今回は投稿をテストしただけの記事です。