Site will be available soon. Thank you for your patience!
"The Clarity filter is iPhone photography's secret sauce." The Wall Street Journal Shooting Camera+ helps you use your iPhone to shoot the best photos you possibly can. Whether you're a seasoned photographer or someone who's barely touched a camera, Camera+ provides you with all the tools you need. See your photos improve the instant you start using Camera+. Manual Shooting for the ultimate contro
前回の記事では、実際の建築プロジェクトにおいて、建築家が建築現場の指揮をとったという実例を紹介しました。今回は設計寄りの話題に移して、プロジェクトだけではなくWebの設計面においても建築分野から学べる考え方があるというお話をしたいと思います。 Webサイトは変化し続けるWebサイトは構築されてから情報が追加されたり、修正されたりしていきます。 これは情報を扱うメディアとしては当たり前のことで、たとえば、雑誌などでも創刊号でつくられたコンセプトを、その後発行する各号でより磨きをかけたり、軌道修正させたりします。 しかしながら、この「変化」は、ただやみくもに変えていけばいいのではなく、その影響範囲や必要性を検討しながら行わなければなりません。今回は、この「変化するWebサイト」についてのありかたを、情報アーキテクチャの観点から考えてみます。 こういった「変化」をWebの設計にどういった形でおり
HTML+CSS+JavaScriptでつくるサイトの定番演出「高級ペライチ」! HTMLファイ部の「HTML5の鬼」ことほんだです。 カヤック社内では「高級ペライチ」という愛称で呼んでいる縦や横に長い1ページサイト。 スクロールに合わせたパララックスやアニメーションの演出が印象的ですよね。 今回は「高級ペライチ」とググると1位に表示される、 僕のはてブ「高級ペライチ」タグから厳選32サイトを紹介します! まずは王道!縦に長い高級ペライチ
Twitter, Facebook, Google+, RSSなど、ソーシャルメディアの不揃いなデザインのボタンを統一した美しいデザインにしてブログやサイトに設置するjQueryのプラグインを紹介します。 Koottam Social jQuery Plugin [ad#ad-2] Koottamの主な特徴 Koottamのデモ Koottamの使い方 Koottamの主な特徴 Twitter, Facebook, Google+などのアカウントを設定するだけで設置できます。 7種類のテーマがあり、CSSベースでカスタマイズも可。 カウントの表示はスタティック・アニメーションに対応。 カラーは簡単に変更できます。 より大きいカウント用に省略表記も対応。 MITライセンスのため、あらゆるブログ・サイトに使用しても無料! Koottamのデモ
みなさんは、サイトをスクラッチで作る時にどうされていますか? HTMLやCSSをイチから作り込んでいくのは大変ですよね。 フリーでHTMLやCSSのテンプレートもいろいろありますが、デザイン要素がガチガチで修正しづらかったり、あまりにもシンプルすぎて結局ゴリゴリ作らないといけなかったりします。 最近だと、Twitter Bootstrapが使いやすくて、いろんなサイトでも使われています。 特にウェブ系のスタートアップは、ほとんどがTwitter Bootstrapをベースにしているんじゃないかというぐらいよく目にします。 しかし、どれもこれも同じような見た目になっちゃってて、デザイン的にはちょっと残念な感じがします。 Twitter Bootstrapを使うと、なぜここまで似てしまうのか? それは、 パーツが完璧に揃いすぎている! のが原因です。 Twitter Bootstrapがバージ
ウェブサイトでやってしまいがちなユーザビリティの9つのミスをSmashing Magazineから紹介します。 9 Common Usability Mistakes In Web Design 下記は、その意訳です。 1. クリックできるエリアが小さい リンクのクリックできるエリアが小さいと、ユーザーはクリックするのが非常に困難です。 解決方法 リンク箇所にpaddingなどを設けて、クリックできるエリアを大きくします。 2. 間違った目的のためのページネーション ページネーションは、内容を複数のページに分ける時に使用します。 しかし、最近ページビューを増やす目的でページネーションを設置しているサイトがあります。これには問題点が2つあります。 一つ目は、1つのコンテンツを読むのにページをロードしなくてはならないこと。二つ目は、SEOと関係があります。ページのインデックス付けを行う際、ペー
自分が作ったウェブサイトを見て、「センスないな」とへこむことはありませんか? 私はよくあります。色使い、レイアウト、写真、文章などなど、どれをとってもセンスないなとへこんでいました。 けど、センスがないのではなく、単に基礎を勉強していないだけということに最近気づきました。センスはもっと高い次元の話でした。 ということで、センスを言い訳にしてしまいがちな分野の基礎を学べるすばらしい記事を集めました。この記事自体単なるまとめ記事ですが、できるだけ厳選し、読んでほしい順に並べました。皆さん、あきらめずに一緒に勉強しましょう。 配色 アクセントになる色を使うのが苦手で、同色系の色ばかり使ってしまうのですが、これらを読めば恐れずに使えそう。 色彩センスのいらない配色講座 ベースカラー、メインカラー、アクセントカラーに分類してどのような色を選ぶべきか分かりやすく解説してくれています。具体例もあって分か
最近はスマートフォン系の開発から離れてしまっているので、感覚が鈍らないうちに(備忘録も兼ねて)スマートフォン向け開発(主にネイティブアプリ開発)におけるユーザビリティチェックリストを作ってみました。 ちなみに、このチェックリストは以下が前提となっていますのでご了承ください。 ・独自性を生み出すようなものではない ⇒現在のスマートフォンアプリのメインストリームの中で、アプリの印象をより洗練されたものにするためのポイントです。 ・案件の内容に関わらず意識すべきポイント ⇒ある程度汎用性の高いチェックリストになっているとは思います。 それでは、全てベーシックな内容ではありますが、その中でも特に基本的なものから説明していきます。 ※僕がiPhoneユーザーということもありiPhoneの画面イメージばかりが並んでいますが、全てAndroidでも使えるチェック項目です。 小さくし過ぎない、詰め込み過ぎ
このたび会社を退職することが決まり、デザインについてほとんど初心者である後輩に対して私の思考を託す時が来ました。 私自身WEBシステムの制作を手がけたことはなく(ないのかよ!!と全力でつっこんでおk)今度のプロジェクトでうちのチーム初のWEBシステム制作案件があるそうなので、デザインする時のポイントなどを自分なりにまとめてみました。 私は携われないんですけどね\(^o^)/ 様々なWEBシステムのデザイン よいデザインはデザインをする対象(今回はWEBシステム)のことを知らなければ出来ません。 自分の考えだけでデザインをはじめると、思考の偏った使いにく~いものになってしまう恐れがありますので 必ず調査をしましょう。 そして、何故その要素がそこに配置されているのかを考えましょう。 以下に様々なWEBシステムのキャプチャと 超稚拙で言葉足らずな安易すぎる説明を掲載します。 ですが、掲載されてい
私はフリーランスの Web デザイナーとして、クライアントさんの Web サイトを作成するお手伝いをさせていただいています。今回は、私が仕事でデザインするときに気をつけている事や、Web 制作のフローをまとめてみました ...。 Webサイトを作るとき、みなさんはどんな制作フローをたどって作ってますか?私はフリーランスで仕事をしていて、最初から最後までひとりで作ることが多いです。今回はふだんデザインする時に気をつけてる事や、いつもしている Webサイトの作成フローをまとめてみました。もっと効率化できることがあるはずだなーと思いつつ、最初から最後までを書いてみました。 また、Webデザイナーってどんな仕事なのっていう質問をときどきいただくので … こんなことしてます … みたいな紹介です。これはあくまで私が Webサイトを作る時にしているフローで、他の Webデザイナーさんや制作会社さんと違
結構参考になったので備忘録がてら ご紹介。Webサイトの制作スピードを より向上させるために、汎用的なUI を集めて、マークアップも綺麗な状態 で済むように設計されたスターター キット、というかフレームワークです。 制作スピードを向上させる目的で作られたHTML5フレームワークです。レイアウトだけでなく、汎用的なUIも備わっていて、class名1つ付けるだけでタブやスライドショーを実装出来るようになっています。 そういった仕様にする事で、シンプルで綺麗で可読性の高いソースを保てるように設計されていたりと、結構参考になるスターターキットですよ。フレームワークは自作してるので良い部分を組み込んでみようかなと思いました。 タブやドロップダウン、スライドショーなどを備えているだけでなく、class名1つで実装出来るようになっているので、綺麗なソースを保持する事が出来るようになっています。 いろいろ
レタープレスエフェクト大好きなんです ...。レタープレスエフェクトを使った Webデザインを観察していて気付いたことをまとめながら、Photoshop を使ったレタープレスの作り方をおさらいしてみました。 最近いろんな Webサイトを見ていると、レタープレス(型押し)を表現したデザインを、たくさん見かけるようになりました。私もきれいなレタープレスが大好きなので、このブログでもたくさん使いたいんですけど、なかなかきれいに表現できません …。レタープレスエフェクトは、黒や白の背景ではあまりきれいにならないし、色やテクスチャによって見え方がかなり変わってきます。レタープレスエフェクトを使った Webサイトを観察していて、こうしたらキレイにできるかも … という視点でまとめてみました。
2011年11月12日13:28 映画 コメント( 6 ) 【画像】ハリウッド映画ポスターにありがちなパターンベスト13が発表 Tweet 1:名無しさん@涙目です。(群馬県):2011/11/11(金) 21:02:39.88 ID:PRA8GE+o0 パクリだらけ!? ハリウッド映画ポスターにありがちなパターン 映画館や街中で見かけるハリウッド映画のポスター、 時折「あれ? 前にもどこかで見たような…」と思うことはないだろうか? 今、“ハリウッドでありがちな13パターンのポスター”がネット上で話題を呼んでいる。 フランス人によるブログから火がついたこのネタは、最近のハリウッド映画のポスターはオリジナリティに欠けるとしてポスターデザインを13種類に仕分けして紹介したもの。 1.海辺に佇む人、背景は雲に浮かぶ顔アップ 2.背中を向けてこちらを振り向く(武器を持っていることが多い)
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く