コンペ記録メモ その２
今日もチラシの裏メモ。
参加中コンペが、もう当分ないであろう好調具合なので記念メモ。パート２。
こちら順調に順位を下げると思いきや踏みとどまって5位キープ中。
飛び入り参加したこちらは順調に順位を上げて9位まで到達。
いや、皆さんが本気を出してくる終盤戦についていけないのは目に見えてるんですけどね。
ただ、両方とも試したい分析手法は実装し切れてないのでがんばる。
Webデザインの流行を振り返る [-1からWeb作成 その1]
これまでの流れ
Webデザインの流行
まずは事前知識としてWebページってどういうデザインが流行ってるんだ？というのを見ていきます。
記憶を頼りにこんなデザイン流行ってたなぁというのを列挙して見ます。
ポータルサイト型
引用：Yahoo! JAPAN
名前は勝手につけてます。
Yahooに代表されるように、２列や３列、情報を細かく区切ってぎっしり表示するようなデザインです。昔はWebは文字で情報を伝える手段という色が強く、効率的に情報を整理した結果な気がします。
今でもポータルサイトではこう行ったデザインが多いですね。
昔はこのデザインのように行列に区切ったレイアウトをするためにテーブルレイアウトという技術があってだね（ｒｙ
Web2.0/RIA
2007,8年あたりでしょうか、Web2.0という言葉が流行語になったように、ユーザーとの双方向性やユーザー体験（UX）が重視された頃です。
この頃にはダイナミックに動くアニメーションやFlash技術などが用られ、Webの進化（というかブラウザの進化？）が強く現れた、、、ような気がします。
派手さと試行錯誤の時代、と言ってもいいでしょうか。
フラットデザイン
2010年あたりでしょうか？デザインがガラッと変わって「のっぺり」としたデザインが流行します。
RIAの反動とも取れますし、スマートフォン時代の到来とも取れます。モバイルファーストが叫ばれた時代でもあります。レスポンシブデザインなんかもこの流れですね。
Windows8のモダンUIやAndroidのマテリアルデザインをはじめ、企業のロゴなんかもこぞってフラットになりました。
また、文字がもつデザイン性を活かすタイポグラフィーなども注目されていました。
現代風？
さて、それらのデザインを経て今の流行はどんなものがあるか見てみます。
シネマグラフ・ヒーローヘッダー
背景で動画が流れるWebが一部で注目を浴びました。
高速な回線や動画サイトの普及もあって実現したものですね。かなりインパクとはありますが、しつこくなりすぎないように工夫は必要です。
また一見写真のように見えますがちょこっとしたアニメーションが入っており、印象的な演出を行うシネマグフという技法も流行中のようです。
画像はyoutube動画を背景にできるjQueryプラグインです。次回以降どこかで紹介。
http://www.seanmccambridge.com/tubular/
パララックスサイト
引用：Vestfrost — Producer of morozylnыh cameras Refrigeration and technics
縦に長く、スクロールによって色々なアニメーションやアクションが起こるサイトです。
フラットというかシンプルな色合いをベースにしてアニメーションで印象を加えたり、逆に写真をふんだんに使って立体感を持たせるなど様々な応用が見られます。
ミニマルデザイン・グリッドレイアウト・スプリットレイアウト
画面を広くシンプルに使うミニマルデザインも増えています。
逆に画面をグリッドに区切るデザイン、カード型に区切るデザイン、分割してそれぞれ別のコンテンツを置くスプリットレイアウトなども増えており、2000年以降の流れがより洗練・応用されているような印象を受けます。
振り返りだけで随分長くなってしまったので一旦区切ります。
次は実際に作るサイトのデザインをどうするか、デザインの第一歩目の部分をまとめていきます。
参考：
2017年デザイントレンドガイド
https://www.behance.net/gallery/47810259/2017-Design-Trends-Guide
-1からWeb作成する プロローグ
よーし、真面目に連載らしい連載するぞー。
なに連載するの？
友人の依頼でWebページを作ることになりました。
大掛かりなWebシステムではなく個人用のちょっとしたものなので、そんな大変なものでもないんですが、せっかく作るなら綺麗なものを作りたいです。
モチベーション？
で、そんなちょっとしたものをブログに書こうと思ったのは、Webサイトを作るためのプログラム技術とか基盤とかの情報はネット上にいっぱいありますが、最初（ヒアリングしたりデザインしたり）から最後（公開して運用）までまとめてるとこってあんまないなぁと思ったからです。
個人が趣味程度にWebページ作る時でも色々やることあるんだよ、という啓蒙と共に、おそらく色々と古くなっているであろう自分のノウハウにマサカリを投げてもらおうという魂胆です。
”-1から”となっているのは古い知識をアップデートするという意思を込めてます。どうでもいいけど。
-1からWeb作成 連載その0
趣味でWeb作成を請け負う心構え
プロローグなので、どんなサイト作るとかは次回からにして、Web作成を依頼された時の心構えでも書いておきます。なんかこう書くとすごい堅い話に見えちゃいますが、基本チラシの裏ブログなので（略
SIerとかで働いてる仕事柄、仕事以外でも「ちょっとWebページ作ってよー」的な依頼はちょこちょこあります。
昔（学生のころ）なら面白がって作っていましたが、職業としてシステムを作り出してからは基本的に無料では受けないことにしています。
イラストレーターの業界でも問題になっていますが、いくら仕事外でも無料で受けてるとITの価値を下げることになりかねないです。
とはいえ、今回みたいな友人の依頼に対して「じゃぁ1.5人月ぐらいだからxx万円ね」みたいなSIerじみたことはしたくないので、ちょっとご飯奢ってもらうとか利益が出たらギフトカードもらうとかそんなのでいいかなという感じです。０と１の差はでかいです。
真面目っぽいことも書いた気もしますが、基本は趣味なのでゆるーく連載していきますよー。
コーヒー飲んだり書いたり
単なる一言日記です。まさにチラシの裏。
CoffeeScriptが不人気な理由を実感している今日この頃。
理想
「あんのややこしいJavaScriptを理解しなくても、わかりやすく綺麗にしかも多様なブラウザに対応できるようにかけるぞー！うおーー！」
現実
「さーて、結局デバッグのためにトランスパイラされたJS読みますかー・・・、あーわかんね。」
いつの間にか不人気ランキング3位です。
昔は割と書きやすくて好きだったんですが、最近使う機会が増えて使えば使うほどこれはしんどいなと。
・・・まぁ結局JSちゃんと理解しとけって話ですけどね。
MacでRails動かすまでの覚え書き
Ruby on Rails動かすためにMacに構築したものメモ。
Qiitaに投稿するには類似記事が多かったのでこっちへ。
とりあえずXCode入れる
→AppStoreから
→OSアップデートしろーと出たらおとなしくアップデートする
その後、XCode Command Line Toolsをインストール
xcode-select --install
Homebrewを入れる
パッケージ管理ソフト。必要なパッケージを簡単に入れれるようにするもので、いろいろ種類はあるけど最近はこれがよく使われるらしい。
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
Rbenvを入れる
Rubyのバージョンを管理してくれるもの。複数のバージョンを共存させれる。
Homebrewを入れていたら、以下の手順でインストールと設定ができます
brew install rbenv
echo 'eval "$(rbenv init -)"' >> ~/.bash_profile
source ~/.bash_profile
Rubyを入れる
利用できる Rubyのバージョンは
rbenv install -l
で確認してインストールを行います。
その後利用したいバージョンをglobalとして設定します。
rbenv install 2.4.1
rbenv rehash #反映
rbenv global 2.4.1
Bundlerを入れる
次にRubyのライブラリの管理ソフトbundlerを入れます。
Bundlerはプロジェクトで利用するライブラリとそのバージョン、依存関係なんかを管理してくれるものです。
Bundler自体もRubyのライブラリの一つなので、まずBundlerを入れて、他のライブラリはbundler経由でインストールすると便利です。たぶん。
gem install bundler
Railsインストール１
Ruby on Railsも1行でインストールできます。すごい。
gem install rails
rbenv rehash
Railsインストール２～bundlerで入れる～
Rails自体も複数のバージョンを共存させたりプロジェクトごとに変えたい場合はbundlerでインストールしておくということもできます。
まず
bundle init
を行うと、設定ファイルであるGemfileが作成されます。
そこにある
gem 'rails'
という記述を有効にして
bundle install --path vendor/bundle
を実行。（2回目以降はbundle installのみで可）
bundle exec rails s
を実行して
を確認。
技術系論文が読みたくなったらどうぞ
ちょっと技術系の論文が読めるところを探したので書き残しておきます。
さくっと手に入りそうなところ中心。
すでにそういったものをまとめている方もいたりするので二番煎じですが。
論文検索サイト
日本語論文なんかが検索できて、手に入るのがJ-STAGEやCiNiiです。
CiNii Articles - 日本の論文をさがす - 国立情報学研究所
調べたいもののキーワードが明確ならいろいろ調べれます。
ただし、出てくる論文は様々（短かったり表紙だけだったり古かったり学生論文？だったり）で、自分が欲しい情報を見つけるにはなかなかの検索能力がいりそうです。
ざっくりと最新の技術動向を見る、というのには向かないかもしれません。
自分の検索能力が低いだけかもしれません。
プレプリントサーバー
最新のものをいち早くというばあいはプレプリントサーバーを探すというのもあるようです。
プレプリントサーバーは、論文が論文誌などで公表される前に査読やいち早く公開するために使われるものらしいです。物理や数学分野の最新情報が欲しい場合はどうぞ。
学会ページ
知りたい分野が決まっているなら、学会サイトで公開されているものを見るのは非常に有用です。さすがにプレプリントサーバーよりは遅いですが、一般人にとっては最先端情報です。
というか、KDDとか論文載せてるんですね。。。（ちょっとそれ系の調べものしてたので驚いた）
、、、ということを過去に調べた下書き記事が残っていたので書いておきました。
