6 Trend Design -2015
皆様わかっているように、別にデザインするときにトレンドに従えなんてだれも言わない！
でも、トレンドを知っておいて損はないしデザインの引き出しが増えますよね☆
以下、2015年のトップ６のトレンドです。
http://www.creativebloq.com/6-image-trends-designers-need-know-about
http://track.adform.net/adfscript/?bn=5913684;cpjs=2
-------------------------------------------------------------------------------------
1, Monochromatic color
モノクロは、だれにでも洗練されたような、その当時を思い浮かばせるような気持ちにさせます。
モノクロにするときローライト、ハイライトをカラーイメージを元に強調させることで印象的なイメージにすることができます。
明るめの白と、強目の黒はKodak Portra風なカラーの写真を表現しています。
ちなみにKodak Portraはカラーネガフィルムのことです↓
口でどんな感じかは説明しにくいので見た方がわかりやすいかと！それでとったやつはこんな感じ↓
ポートレイト専用だそうで、なんかレトロチックでいい雰囲気でてますね！
2, Sensory immersion
デザインは、ただ人の目を引きつけるだけではありません。
素敵なデザインは、人の目を引きつけ、さらにその人たちを元気にしたり、匂いや味を想像させたり、なんかかしらの感情を動かします。
それはたとえば、とてもdetailのわかるテクスチャに焦点が当てられたものを使用するとか。
これは、スマホのような小さいスクリーンでとても映えます。
私たちの周りはデジタル機器に囲まれていますが、それでもやっぱり人間。
味わいたいし、匂いを嗅ぎたい！時代は変わっても人間味をわすれなたくないという私たちの思いはデザインにも大きな影響を与えているんですね。
3, The letterbox look
スクリーンの大きなTVからシネマ、スマホ、タブレットやモニターなどの長方形は新しい視覚になってきてます。
だから最近は自然と、写真ときたら” * Letterbox Look ”がトレンドとなって、デザインのリアルな時間軸の表現・価値がたかくイメージに残りやすくなるのですー。
instagramでは、写真の周りを細く切り取って（* 2.35:1 ratio）加工します。これは、写真の表面上にフォーカスポイントをおき物語性を出したり、自分のデザインに親近感がわく効果があるんです。
特にWebデザイナーは、このトレンドをmobile first(モバイルを起点としてサービスを作り上げていくこと)の動向であるととらえて、今トレンドであるヒーローイメージ(でっかいイメージをヘッダーにバーンって使うこと)と合体させちゃってもいいかもですね。
*Letter box
表示画面において他の画面サイズ企画で潰されて表示されないよう、表示互換性を取るために本来および横長比率の部分を黒くして表示すること。
比率を保持したまま、サイズの変形をする。
*スクイーズ
比率を無理やり縮めて枠にはまるように表示させること。
*2.35:1 raito
-------------------------------------------------------------------
海外サイト例）
・保険会社
https://www.apple.com/jp/watch/
・モバイル
http://shop.ee.co.uk/campaigns/my-offers.html?
-------------------------------------------------------------------
4, Super still-life
小さいスクリーンは大きい写真が大好き！
さらにスマホ、タブレットやその他デジタルデバイス向けのデザインにとって静止絵の使用度はなくてはならない存在となっています。
しかし、ただ一つのシンプルなオブジェクトの静止画はもう存在しません。今は、写真、アート、技術によってもっと生命のないものにクリエイティブを生み出すことを求めているんです。たとえば、いろんなオブジェクとを並べて文字をつくったり、ストーリ性のあるものを作る、形の違うオブジェクトを並べて焦点を変える、などなど。
ブランドやビジネスなどの商品にもっとグラフィック性ともっとユーザーが引きつけるようななにかを与えれば、ものすごく便利な構成になりますよね。
5, Point of view
最近、ブログでもよく見かけるようになったセルカ棒とか！セルフィーが流行ってますよね。私たちは私たち自身、またはその他の人たちを少し違う視点から見るようになってきました。
GoProのような動きをとれるカメラは、viewpointがもっとパーソナルになり、もっと自然な視点で自撮りできるよう新しいアングルなんです。
スポーツやライフスタイルの写真は特に今、とっても注目されています。
デザイナーにとって、このトレンドはなにか決められたものではなく、それぞれの視点の傾向や自分たちが信じるもの、正しいと思うライフスタイルを提供することなのです。
ソーシャルメディアを使いこなしたり、*POV imageryは今やデザインには必須の道具なんですね。
*POV(主観ショット)
カメラと登場人物の視線を一致させるようなカメラワーク
6, All kinds of people
今時のデザインは”今”な感じを伝えるものが必要。
”昔あった”ではく、”今”それが世界で起こっていることを伝えること！
新しいトレンドとしてはいろんな人間がいるよ〜っている多様性を現す写真が大事☆
今まで特定の人を使ってきたけど、最近はもっとストーリ性があっておもしろみのある、もっとみんなが興味を持つような人が欲しいみたい。
例えば、写真を見て民族性（国籍・性別・文化）を感じ取るのではなく、多様性を感じるもの：ファッションセンス、ライフスタイル、身体能力、他と違う何か。
なにが真実かってことを無視すれば、こういった写真を使う事はもっと見ている人と繋がり、デザインに大きな影響力を加えるかもしれない。
-------------------------------------------------------------------------------------
Mac OS X 最新版”EI Captain”
Macからまた新しいOSが出たとのこと...
この前Yosemiteにしたばっかだったはずなのになあw
早いなー。
新しいやつは「EI Captain」っていうらしい。
【新機能】
・Spotlightの検索機能が改良
・アプリ内の検索機能の強化
・Split Viewという画面上でアプリを同時実行が可能な機能
・コンピュータによるアプリ間の切り替えがスムーズ
・Metalの導入
（iOS 8開発者が視覚的に洗練されたソフトウェアを作れるよう導入されたもの）
・新しい日本語入力方法
などなど...さらにグレードアップしてるらしいです。
中でもきになったらのが、”新しい日本語入力方法”について。
普通は、わたしたちがキーボードで入力するとき、スペースキーで漢字に変換しますよね。いわゆる”文節区切り”で変換されてるってこと。
長ーい文を一括変換しようとして、
そこ変換しなくていんじゃ〜いってなるのはあるあるですよね。
たまに綺麗に変換されてすっきりする時あるけど。w
でも、新しく機能として追加されたものに、”自動的に文節ごとに変換してくれる”という機能が追加されたみたいなんです。
↓
何回もスペースキーを押さなくても、自動的に文節を読み取ってソフトが自動変換してくれる「ライブ変換」の登場。スペースキーの押す回数が「ゼロ」になるかもですね。
そしてそしてこれは７月からスタートする予定なんです。
どんどん新しいものがでてきて便利になるなー、将来はロボットと暮らしてそうだなー怖いなーなんて思う事もあるけど。
楽しみですね〜☆
UI/UXデザイン
※UIデザインとは-
User Interface（ユーザーインターフェイス）はインターフェイスを通じて目に見えない機能を視覚的にみて操作してコミュニケーションする。ユーザとデジタル機器とのコミュニケーションがうまくできるように手伝ってくれるOS/アプリ画面など。
例えば、
・iPhoneのアプリがアイコンでなく、テキストだったら...いろいろなアプリの/中から写真アプリを探して立ち上げるまで時間かかる...！
・アイコンとアイコンの余白がなかったら...間違って押して違うアプリを立ち上げちゃう！
↓
UIデザインは、不便がないようにユーザとデジタル機器とのコミュニケーションをより早く、より便利に、より正確にできるようにすること。
※UXデザインとは-
User experience（ユーザーエエクスペリエンス）についてのエクスプレスデザイン。デジタル機器・システムやサービスを使うユーザーがどのくらい満足し、どのような経験をし影響があるか、とかを指すもの。
例えば、
・iPhoneの「pinch」は、タッチパネルに2本の指をのせ、画面上の対象物を拡大縮小する。2本の指を縮めると、画像が小さくなったり、広げると大きくなったりとか。なぜか、この作業って考えなくても自然にやってる...
これは、ユーザの行動や無意識をちゃんと把握して行動をデザインしたから、説明書がなくてもストレスフリーで直感にまかせて使えるようにUIデザインしたから。
・instagramは、自分でフィルタを加工し、みんなに共有できるけど、みんなスタンプとか色合いとか「かわいい！うれしい！みせたい！たのしい！」と、感情が生まれるような体験をする。
↓
UXデザインはユーザがサービスの目的に共感して、＋な体験や満足を得られるようユーザの感情・行動・態度をデザインすること。
-----------------------------------------------------------------------------------------
※UIデザインとUXデザインの関係
Tシャツにたとえると....
【A：着やすさ】
・生地の肌触りがいい
・しわになりにくい
・着脱が楽。
【B：色々な体験・感情】
・ロゴがかわいい
・サイズぴったり
・色合いがタイプ・自分おしゃれ！
【C：着終わってからの満足感】
・このブランドの服をもう一枚欲しい
・渋谷にきたらまたこの店来たい！
・友達と色違い・おそろいで欲しい！
-----------------------------------------------------------------------------------------
【A：着やすさ】がユーザビリティ（使用性）を重視したUIだとしたら、
【A：着やすさ】、【B：色々な体験・感情】、【着終わってからの満足感】が全部UXとなるー！
UXデザインがよくできていると、ユーザは＋な体験と満足を得て、
それは”また着たい”と思わせるいい結果に繋がる。
でも、Tシャツが大きくてダボダボでユーザが不愉快な思いをしてしまったら、ユーザはこのTシャツを着るコトでネガティブな体験をするのだ〜い。
このように、”良いUI＝良いUX”ではなくても、良いUXには良いUIが絶対ぜーったい必要！！！！！！
というわけで、いつも何気なく聞いていたUX/UIをまとめたメモメモでした。
Vim
※Vimとは
--プログラマに人気の高いエディタの１つ。
UNIX系オペレーティングシステムで長らくデフォルトインストールされてきたエディタで、システム管理や設定ファイルの編集などに使われることが多かったらしい。
ワープロとは操作方法が全く違くて、基本的に「コマンドモード」と「入力モード」という二つのモードを切り替えながら編集作業を実施する。
これは,,,,覚えるまで大変かもしれなけど、マスターしたらめちゃ高速で編集可能いなっちゃうらしい。修行じゃ！だー
【その他まとめ】
・軽量で高速、そして多機能
・コマンドモード/入力モードにわけて作業
・自分の欲しい機能の拡張が簡単。
・ほとんどのプラットフォーム（Windows, Mac OS X, Linux, FreeBSD）で動作する。
【よく使うコマンド】
他にもいろいろあるけど、まずよく使う、覚えた方がいいコマンドのまとめ↓
【 :e 】fileを開く
【 :e. 】エクスプローラーを開く
【 :w 】保存
【 :q 】終了
【 :q! 】保存せず終了
【 ZZ 】保存して終了
【 ZQ 】保存せず終了
【 h, j, k ,l 】左、下、上、右
【 esc 】ノーマルモードに戻る
【 Ctrl-[ 】ノーマルモードに戻る
【 v 】ヴィジュアルモードに戻る
↓その他
http://motw.mods.jp/Vim/command.html
Node.js ~Git インストール~
まずこちらから「Homebrew」をインストール
黒い枠の中身をコピペ。
$ brew doctorを実行し、結果が、Your system is ready to brew.であれば
成功！
==============================================================
1,Gitをインストールします！
$ brew install git
2,問題なくインストールできているかバージョン確認(→git version 2.4.2 表示でOK)
$ git --version
※もしここでバージョンがインストールされたものでなく古い（もともとMacに入っていたもの）だったら、
（HomebrewでインストールしたGitは「/usr/local/bin/git --version」）
→新しくインストールしたGitのバージョンは問題なく最新版だったのでHomebrewでインストールしたGitを優先するために
$ sudo vim /etc/paths ・ password入力で下記に新しくコマンドの編集ができるものが登場
新しくインストールしたGitが格納されている
/usr/local/bin を最上部に記載しえ優先順位を一番に。(iで編集、編集おわったらescキー)
※もう一度バージョン確認（$ git --version）・場所確認する。（$ which git →「/usr/local/bin/git」でOK）
＝マイMEMO・次回これ＝
npm
=======================================================
・npmとは
Node.jsのモジュールを管理するためのツール。
（これは、Node.jsをインストールした直後から、必ず使う事になるもの！）
Node.jsには様々なモジュールが公開されており、npmを使う事で簡単にインストールできる。また、自分でモジュールを作成して公開する場合にもNPMを使用する。
=======================================================
・これだけは覚えるべき３つのコマンド
1, npm init
2, npm install
3, npm run
これだけ覚えれば、ひとまずフロントエンド開発を進めることができる。とりあえずね！
=======================================================
1, npm init
→ディレクトリ下は、俺らnpmが管理下におくんだ！宣言。
2, npm install
→npmリポジトリからライブラリをダウンロードしてくるコマンド。
npm（ライブラリそのものはサイトから取得）
3, npm run
→npm scriptsと呼ばれるタスク実行機能を呼びだすコマンド。
*コマンドとは、簡単に言えば「命令」のこと。
*モジュールとは、「システムを構成する要素」となるもの。
Sass ~Grunt~
Sassをコンパイルしてくれるものが「Grunt」
あれ？そしたら「Koala」ってどうなの？って思うけど、これもコンパイルするためのもの。なにが違うか、と言えば、
「imgも加工できるか。」的なとこです。
だから、「Koala」はコンパイルだけするならOK。だってそれならターミナルでもできるもんね。
でもやぱりimgの色々な作業とか出てくるからGruntのがいいってこと。ってことを私も最近知ったんだけどねえ笑
========================単語予習========================
Node.jsはサーバ側で動作するJavascriptであり
※通常、Javascriptはユーザーのブラウザで動作するプログラミング用語。
PHPやRubyのように、サーバーサイドのプログラムをJavaScriptで記述できるのがNode.js。
・Node.js
Node.jsとは，ブラウザGoogle Chrome用に開発されたJavaScriptエンジンV8がサーバ上でプログラムを実行できるように，ファイルやネットワークI/Oなど多くの機能を追加したものです。
↓
C10K問題（クライント１万代接続問題）を解決する
・従来のWebサーバーは、１万接続もあるとパフォーマンスが落ちる...ので、その問題を解決する！
【特徴】
・サーバーサイドのJavaScript（→サーバーサイドで動くJavaScriptの実行環境）
・非同期（*I/Oの処理結果を待たず処理を進める）
・ノンブロッキングI/O（I/Oの結果を待たないで処理を進める。I/O処理が終了したらコールバック関数を実行。）→大量の処理に対応・たくさんの接続の処理がめっちゃ早い！！
（リクエストやコールバックの発生は、イベントとして登録して扱い、そのイベントに関する処理が終わったら、次のイベントを処理する。）
・イベントドリブン
・シングルスレッド（メモリ消費が少ない、仕事切り替えが少ないので早い）
・JavascriptエンジンがGoogleのV8で早い
*I/O(アイオー)：Input/Outputの略。情報を入力(input)し、計算結果を出力(output)するという処理のこと。もしデータのI/Oがいっぱい行われたら、ハードウェアやネットワークにI/O処理の付加が発生することがある。
【Node.jsで作られたアプリの特徴】
・小さいデータや小さい計算の場合、速い
・メモリ消費量が少ない
・ローカルとリモートともデータのやり取りをシームレスに行うフレームワーク（Meteor）などができている
・サーバー側、クライント側で処理の共通化ができる（入力値チェックなど）
・サーバーサイドのコード変更したとき、Node.jsアプリの再起動が必要な（場合が多い）
・リアルタイムなアプリケーションに合う。
・シングルページアプリケーションに合っている。
・WebSocketを利用するアプリに合っている
※ちなみに通常、Node.jsを『node』と呼ぶらしい。
なんかドーモクンみたい。↓NHKの茶色いキャラクター。
