スキップしてメイン コンテンツに移動

投稿

5月, 2015の投稿を表示しています

PC・スマートフォン共通で使えるメニュー「hamburgler」

すっきりとしたエフェクトで、表示・非表示を切り替えるメニュー「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="#">Menu Name 0…

Photoshopで暗く影になってしまった写真を、明るくしてみよう(3パターン)

撮った写真が思いのほか暗くなってしまった、というとき、本当は写真を撮る段階で調整するのがベストなのですが、どうしてもこの写真がいいという場合におすすめのPhotoshop技術を3パターンご紹介。

▼元の写真


▼レベル補正を使用


「イメージ」→「色調補正」→「レベル補正」またはショートカットキーでCtr+L(Windows)、Cmd+L(Mac)で操作ウインドウを開きます。

三角のツマミ(△)を動かして全体を明るくします。

簡単に明るさを調整できるメリットがある一方、やりすぎると色まで飛んでしまうというデメリットもあります。



▼シャドウ・ハイライトを使用


「イメージ」→「色調補正」→「シャドウ・ハイライト」とたどって操作ウインドウを開きます。

シャドウの値を大きくすると明るくなり、ハイライトの値を大きくすると影がつきます。

レベル補正では全体を明るく/暗くするのに対し、シャドウでは暗い部分が明るくなり、ハイライトでは明るい部分が暗くなります。

なので、部分的に明るくしたい/暗くしたいという場合におすすめです。



▼HDRトーンを使用


HDRトーンを使用するとHDR風な写真を作ることができます。
HDRでは、人間が目で見たイメージにより近い写真を再現することができます。

「イメージ」→「色調補正」→「HDRトーン」をたどって操作ウインドウを開きます。

デフォルトでは明暗・コントラスト・彩度(鮮やかさ)の強い雰囲気になるので、値をいくつか抑えつつ調整します。



上記3つの方法とも、操作ウインドウの「プレビュー」をチェックのオン/オフを切り替えると、プレビューしながら値の調整ができます。

元となる写真の明るさや、雰囲気に合わせて使い分けたり、複数の方法を合わせて加工してみるとよいですね。



Written by Creative Flake

【暗号】OAuth 2.0より考察

最近はログインスクリプトを書くとき、いろいろなソーシャルプラットフォームに対応できるようにしてほしいという要望が多くあるため、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
自分がこれはとてもよい方法だと思う理由に入る前に、まずは基本的な暗号化方式と鍵交換をおさらいしたいと思います。



▼対称鍵暗号
最も簡単な暗号化/復号化方式で、暗号文は送信者と受信者の両方に、メッセージを相互変換するための共通鍵(ルール)を作ることです。



しかしこの方法だと、第三者に鍵を盗まれてしまう可能性があったため、ジェームズH.エリス、またはホイットフィールド・…