フレークの素 | Web制作・システム開発のCreativeFlakeブログ

すっきりとしたエフェクトで、表示・非表示を切り替えるメニュー「hamburgler.js」。 PCとスマートフォンで同じデザインを使えて、しかも軽量。 まずは動作はこんな感じ。 Demo & Download 左上のメニューアイコンをクリック（スマホ、タブレットはタップ）すると、メニュー画面が展開されます。 Step1 jQueryを読み込みます。 GoogleのCDNの場合は <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> jQueryのCDNの場合は <script src="https://code.jquery.com/jquery-1.11.3.js"></script> Step2 jsファイルとcssファイルをhead内で読み込みます。 <script src="hamburgler.js"></script> <link rel="stylesheet" href="hamburgler.css"> Step3 body内に次のコードを記述します。 <div class="mobilenav"> <li><a href="#">Menu Name 01</a></li> <li><a href="#">Menu Name 02</a></li> <li><a href="#">Menu Name 03</a></li> <li><a href="#">Menu Name 04</a></li> <li><a href=...

撮った写真が思いのほか暗くなってしまった、というとき、本当は写真を撮る段階で調整するのがベストなのですが、どうしてもこの写真がいいという場合におすすめのPhotoshop技術を3パターンご紹介。 ▼元の写真 ▼レベル補正を使用 「イメージ」→「色調補正」→「レベル補正」またはショートカットキーでCtr＋L（Windows）、Cmd＋L（Mac）で操作ウインドウを開きます。 三角のツマミ（△）を動かして全体を明るくします。 簡単に明るさを調整できるメリットがある一方、やりすぎると色まで飛んでしまうというデメリットもあります。 ▼シャドウ・ハイライトを使用 「イメージ」→「色調補正」→「シャドウ・ハイライト」とたどって操作ウインドウを開きます。 シャドウの値を大きくすると明るくなり、ハイライトの値を大きくすると影がつきます。 レベル補正では全体を明るく／暗くするのに対し、シャドウでは暗い部分が明るくなり、ハイライトでは明るい部分が暗くなります。 なので、部分的に明るくしたい／暗くしたいという場合におすすめです。 ▼HDRトーンを使用 HDRトーンを使用するとHDR風な写真を作ることができます。 HDRでは、人間が目で見たイメージにより近い写真を再現することができます。 「イメージ」→「色調補正」→「HDRトーン」をたどって操作ウインドウを開きます。 デフォルトでは明暗・コントラスト・彩度（鮮やかさ）の強い雰囲気になるので、値をいくつか抑えつつ調整します。 上記3つの方法とも、操作ウインドウの「プレビュー」をチェックのオン／オフを切り替えると、プレビューしながら値の調整ができます。 元となる写真の明るさや、雰囲気に合わせて使い分けたり、複数の方法を合わせて加工してみるとよいですね。 Written by Creative Flake

最近はログインスクリプトを書くとき、いろいろなソーシャルプラットフォームに対応できるようにしてほしいという要望が多くあるため、 OpenID のみを使ってきたのですが、 OAuth （オープンプロトコル）を学んで、おもしろいダイアグラムを見つけました。 参照： http://tools.ietf.org/html/rfc6749 ユーザーが認証を与えると、アクセストークンとリフレッシュトークンのペアをもらいます。そうすることでユーザーはアクセストークンを使ってリソースにアクセスできるようになります。 ここで最も重要なポイントは、アクセストークンはすぐに有効期限切れになってしまう点です。アクセストークンが切れると、リフレッシュトークンを使って新しいトークンのペアをもらいます。そうすることでセッションが常に新しく、乗っ取りが難しくなります（ちゃんと実装していれば。） そこで、OAuth 2.0は安全ななメッセージ交換をするのにこれは非常にいい方法だと考えました。というのもOAuth 2.0は1.0よりもよくないのですが、参考として It took IETF about 31 draft versions and the resignation of the lead author/developer Eran Hammer from the committee to finally publish the spec. Eran sparked a controversy by calling the spec "a bad protocol and a case of death by a thousand cuts". 参照： http://code.tutsplus.com/articles/oauth-20-the-good-the-bad-the-ugly--net-33216 自分がこれはとてもよい方法だと思う理由に入る前に、まずは基本的な暗号化方式と鍵交換をおさらいしたいと思います。 ▼対称鍵暗号 最も簡単な暗号化／復号化方式で、暗号文は送信者と受信者の両方に、メッセージを相互変換するための共通鍵（ルール）を作ることです。 しかしこの方法だと、第三者に鍵を盗まれてしまう可能性があったため...