タグ

ブックマーク / designcolor-web.com (4)

  • 錯視とは?Webデザインにおける視覚調整でユーザーの「違和感」を解消しよう - Design Color

    錯視とは 視覚調整について知る前に、まず「錯視」とはどういうものかについて触れておこうと思います。 先述したように、錯視とは端的に言ってしまえば「目の錯覚」のことです。人間の視覚は必ずしも正確ではありません。目で受け取った情報を、脳が勝手に推測したり補完することにより、しばしば実際の姿とは違うように見えてしまうことがあります。 例えば有名なものに「ミュラー・リヤー錯視」があります。以下の2の矢印の横棒はふたつとも同じ長さですが、下の横棒の方が明らかに短く感じられるのではないでしょうか? 上記の錯視についての解釈はいくつかあるらしいですが、どれも無意識に矢印の斜め線も含めて長さを測ってしまうためだったり、「下の矢印の方が遠くにある」と認識するためだったりと、受け取った情報を脳が自動的に補完してしまうことが原因とされています。 このように、たとえデザイン上のふたつの要素が全く同じ大きさや色で

    錯視とは?Webデザインにおける視覚調整でユーザーの「違和感」を解消しよう - Design Color
    gambol
    gambol 2016/07/04
  • 実際に泊まれる「ゴッホの寝室」からアクションゲームまで!?巨匠ゴッホとコラボした世界中のユニークな作品たち - Design Color

    一晩10ドルで泊まれるリアル版「ファン・ゴッホの寝室」 シカゴ美術館は、ゴッホの作品「ファン・ゴッホの寝室」全3点を同時に展示することを記念して、リアル版「ファン・ゴッホの寝室」を制作し、実際に宿泊できるように一晩10ドルで貸し出すことにしたそうです。 一晩1,000円ちょっとで泊まれるって、すごく安いですよね!?再現度のクオリティも高くてビックリです。まるで物のゴッホの絵画の中に入ってしまったかのように感じられそう。 泊まりたい!と思って予約サイトを見てみたら、なんと現時点で2019年まで空きがない状態でした!やっぱり大人気なのですね〜…。 実際に予約をしたい方は以下の宿泊仲介サイト「Airbnb (エアビーアンドビー)」より! Van Gogh’s Bedroom – 借りられるアパート – シカゴ そしてこれが物の「ファン・ゴッホの寝室」。これは、1888年にゴッホが南フランスの

    実際に泊まれる「ゴッホの寝室」からアクションゲームまで!?巨匠ゴッホとコラボした世界中のユニークな作品たち - Design Color
    gambol
    gambol 2016/06/10
  • とっても幻想的な泡のスクリプト!実装方法やサンプルを紹介 - Design Color

    はじめに 「あくちー(@actywav)さん」といえばとってもポップなデザインのサイト「actyway」の中の人です。あの有名なブックマークレット「ソーシャルてんこもり」など、便利系から面白系まで幅広いプログラム情報などが満載のブログです! 今回は、そんなあくちーさんの良記事のひとつ「まるでサイダーみたい!炭酸飲料みたいに気泡が上がってくスクリプトでシュワワのアワワ! : actyway」に沿ってお伝えします! カスタマイズ方法 泡の動き(Javascript) 泡スクリプトのベースは先日Web系ブロガーさんの間でブームを巻き起こした「雪スクリプト」をベースにしているそうなので、そちらを参考に変更しました。 クリスマスに使いたい!雪のパーティクルをチラチラ降らすスクリプトを作ってみよー : actyway そして泡のソースコードはこちら。自分好みにカスタマイズするなら、主に下記のハイライト

    とっても幻想的な泡のスクリプト!実装方法やサンプルを紹介 - Design Color
    gambol
    gambol 2016/06/10
  • 初めてPhotoshopでWeb制作する前にやっておくといい設定8(CS6/CC含む) | Design Color

    はじめに 先日ちょうどAdobe Creative Cloudを申し込みました。 Photoshopをまっさらな環境にする必要があるため、今回はまさに新品状態のCS6/CCの画面で解説をします! もくじ 定規などの単位はpxで統一 「自動選択」で図形からレイヤーを選択する 「バウンティングボックス」を表示して選択や変形をしやすくする 「ピクセルにスナップ(エッジを整列)」で端がぼやけるのを解消 レイヤーコピー時に「〜のコピー」とつけないようにする スライス書き出し時に「images」フォルダを作成しないようにする 【CS6/CCの場合】カラーテーマをグレーにする 【CS6/CCの場合】切り抜きツールを「クラシックモード」にする 起動画面。か、かっこいい…! CS6/CCはUIが黒いのですね。ちょっと慣れない。 従来のグレーにする方法も後ほどお伝えしますので、どうぞおつきあいください! 1.

    初めてPhotoshopでWeb制作する前にやっておくといい設定8(CS6/CC含む) | Design Color
    gambol
    gambol 2014/09/25
  • 1