『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年3月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材/配色やWeb制作といった最新トレンドも公開中。
iphone向けにレイアウトを組んだ Webサイトのデザインギャラリー・ Meer.liのご紹介です。同じような デザインギャラリーは沢山あるの で参考までに。他にもアイコンや iPad用も構築中みたい。 iPhone向けにレイアウトを組んだWebデザインのギャラリーです。他にもiPad用、アプリアイコンのギャラリーも構築中のようです。 キャプチャが羅列されており、その場でスライド化されているのでページを移動する事無くデザインを確認出来ます。 ↑ 個別ページでもスライドになっており、下部にディテールが載ってます。 ↑ まだ数は殆どありませんが、アプリアイコンも収集してるみたいです。iPadもありましたよ。 暫く経ってから見てみると数が増えてるかもですね。今後に期待です。 Meer.li
こんにちは、デザイナーの王です(●´⌓`●) 今回は「imgタグでCSSスプライトを使う方法」について説明します。 そもそもCSSスプライトって何ぞや?という方は、下記ページに詳しく説明されているので、見てみてください。 CSSスプライトで画像を円滑に表示させる – Webクリエイターボックス: https://www.webcreatorbox.com/tech/css-sprite/ どうしてわざわざimgでCSSスプライト? 一番の理由は、imgタグなら印刷したとき印刷物に反映されるからです。 対比画像の、フォーム下部のボタンに注目してください。通常のスプライトでは印刷に反映されないんです。 ユーザ側で印刷の設定をいじればbackground-imageでも印刷できるんですが、やはりデフォルトでできた方が親切ですよね。(●´⌓`●) 便利なテクニックなので、覚えておきましょう! CS
こんにちは、デザイナーの王です。「とりあえずタイトルに興味を持ったけどいまいちピンとこなかった」という方もいるのではないでしょうか。 ずばり、Photoshopのスクリプト機能を利用して、表題の作業を自動的に処理させるということです。僕みたいな怠け者で楽をしたい人にはぴったり! 今回主に紹介したいのは自作のスクリプトで、Webに特化した作業を簡単にしてくれます。 ダウンロードはこちら(ダウンロードが開始されます): https://liginc.co.jp/demo/2012/09/PhotoshopScripts.zip スクリプトを使うには? まずはスクリプトの使い方について説明していきます。 スクリプトをダウンロードし解凍したら、拡張子が「jsx」のファイルが幾つか入っていると思います。それらを下記のフォルダにコピーし、PCを再起動させます。 Windows:PhotoshopPre
ブログ パスワード認証 閲覧するには管理人が設定した パスワードの入力が必要です。 管理人からのメッセージ https://mac-tegaki.comへ移転中 閲覧パスワード Copyright © since 1999 FC2 inc. All Rights Reserved.
Daftar Serta Masuk Saat ini Di Situs Slots Online Terpilih Ojekslot Seperti yang kita pahami waktu ini ada sangat banyak permainan slot online paling sederhana yang dapat dimainkan dalam sekejap hanya cukup masuk di sana saja ojekslot terunggul. Di sini dapat ada sangat banyak bermacam permainan luar biasa yang pastinya dapat anda temukan dengan ringan. Beraneka permainan terbaik di sini dapat and
スマートフォンのデザインをする際の UI のサイズには誰もが最初は悩んでしまいます。そんな時に役に立つのが、Android や iOSのUI のガイドラインです。その中から、ボタンのサイズに関する部分だけを抜き出して集めました。 ボタンのタッチ部分のサイズは最小で高さと幅は44ptが推奨されているみたいです。ただし、2010年に開催された Apple Tech Talk にてApple のUIデザイナーの Eric Hope 氏は、垂直方向へボタンがかさならないのであれば、例外として高さは 最小で22ptをOKとしていると話しています。事実、iPhone のランドスケープモードでは44px x 44px ではなく、48px x 38pxの高さのボタンも見受けられます。
Macのプレビュー(Preview.app)で、画像ファイルの形式を変換する方法です。 現在開いている画像のフォーマットを変更する方法 複数の画像のフォーマットを同時に変更する方法 を紹介します。 プレビューで写真のフォーマットを変更 プレビュー.appでは、12種類の画像フォーマットを表示したり、変換したりすることができます。 GIF JPG JP2(JPG 2000) BMP OpenEXR(EXR) PDF Photoshop(PSD) PICT PNG SGI TGA TIFFなどのさまざまな種類のファイルに変換することができます。 現在開いている画像ファイルのフォーマットを変更する方法 現在開いている画像ファイルを変換するには、「別名で保存」コマンドを実行します。 「保存」ダイアログの「フォーマット」の欄を変更し、そのまま保存すれば自動的に変換されます。 また、フォーマットごとに
Hello friends, we hope you have enjoyed our latest article “Google Plus: The good, the bad and the ugly”, the article has generated a lot of controversy that in the end will help us spread the word about this amazing social experiment from the Google crew. To continue with the same topic, today we have released an off the hook freebie for all of you featuring a huge bundle of Google Plus interface
閲覧上の注意 この記事で対象としているバージョン0.5.3は結構古いので注意してください。 その他の割りと新しい情報は Backbone.js Advent Calendar 2012 などにあります。 (追記ここまで) Backbone.js入門の最終回は Router と History です。 Backbone.js入門 「MVC」で述べたように、URL が変更された時に発生する popstate または hashchange イベントを監視してルーチンを起動するのが Router の役目です。History は Router の裏方で頑張る実体で、直接操作することはほとんどありません。 URL が変更された時にアクセスされるのが Router なので、Rails 的な MVC の枠組みで言えばコントローラと言えますし、伝統的な MVC で言えば全てのアンカーとブラウザの進退ボタンを
閲覧上の注意 この記事で対象としているバージョン0.5.3は結構古いので注意してください。 その他の割りと新しい情報は Backbone.js Advent Calendar 2012 などにあります。 (追記ここまで) Backbone.js入門シリーズも佳境に差し掛かってきました。 View と Model の連携は既に取り上げたので、今回は特に Collection と View Model との連携に主眼を当てて記述したいと思います。 View と Collection の連携 復習の意味も込めて、View と Model の連携方法をもう一度記述すると、大枠として次のようになります。 // モデルの定義 Hoge = Backbone.Model.extend({}); // ビューの定義 HogeView = Backbone.View.extend({ events: { "
閲覧上の注意 この記事で対象としているバージョン0.5.3は結構古いので注意してください。 その他の割りと新しい情報は Backbone.js Advent Calendar 2012 などにあります。 (追記ここまで) 今回は Collection です。 特に難しいことはなくて、複数の Model を扱うためのオブジェクトです。間違っても MVC の C ではないです。 基本的な使い方 真新しさは特にありません。強いていうなら、model に何モデルの集まりを表すものかを指定するくらいです。 var Blog = Backbone.Model.extend({}); var BlogList = Backbone.Collection.extend({ model: Blog });
閲覧上の注意 この記事で対象としているバージョン0.5.3は結構古いので注意してください。 その他の割りと新しい情報は Backbone.js Advent Calendar 2012 などにあります。 (追記ここまで) 今日のテーマは View と Model の連携です。 基本的なパターン 例えばブログサービスを作っているとします。 おそらく Blog というモデルや、それを表示するページのビューを作ることになると思いますが、記事の全文を表示するビューや複数の記事をリスト形式で表示するビュー、編集ビューなどなど、一つのモデルに対して複数のビューが存在するのが一般的ではないでしょうか。 このように View と Model は基本的に 多対一 の関係になっています。 そのため、Model の属性が変更されたら、複数の View に変更を通知・反映しなければなりません(でなければユーザはシ
閲覧上の注意 この記事で対象としているバージョン0.5.3は結構古いので注意してください。例えばこの記事の内容でいうと、validateに失敗したときに発生するイベントは'error'から'invalid'に変更されています。 その他の割りと新しい情報は Backbone.js Advent Calendar 2012 などにあります。 (追記ここまで) 今日のテーマは Model です。 MVC に関する回で Backbone.js における MVC は Rails などの WAF における MVC よりは伝統的な MVC に近い というようなことを書きました。 しかしながら、モデルに関して言えばどちらの場合も大差ありませんから、気分が楽です。 Rails におけるモデルである ActiveRecord が OR マッパーとしての役割を持っていたり、データのバリデーション機能を持っていた
閲覧上の注意 この記事で対象としているバージョン0.5.3は結構古いので注意してください。例えばこの記事の内容でいえば、$elプロパティなどが追加されています。 その他の割りと新しい情報は Backbone.js Advent Calendar 2012 などにあります。 (追記ここまで) Backbone.js Advent Calendar もようやく折り返し地点。 そんな節目のエントリで取り上げるのが Backbone.js プログラミングでの最重要登場人物の一人である View です。 前回のエントリで Backbone.js では View が各種の処理を起動するということを説明しました。 今回は View を使って、イベントハンドリングを行う方法について主に解説していこうと思います。 View と DOM tree View の役割は大きく分けて2つあります。 特定の DOM
閲覧上の注意 この記事で対象としているバージョン0.5.3は結構古いので注意してください。 その他の割りと新しい情報は Backbone.js Advent Calendar 2012 などにあります。 (追記ここまで) 予定では View の日ですが、当初の予定を変更して、今回は Backbone.js における MVC について解説したいと思います。 なお、今回の内容は、私の認識方法の紹介であり、異なる考え方をする人もいると思います。 とりあえず大事なことは「Rails の MVC と同じものだと考えてはいけない」ということです。 Backbone.js と MVC Ruby on Railsに代表される MVC アーキテクチャを採用した WEB アプリケーションフレームワーク (WAF) に慣れ親しんでいる人にとって、MVC という単語は馴染み深いものだと思います。 しかしながら、本
閲覧上の注意 この記事で対象としているバージョン0.5.3は結構古いので注意してください。この記事でいえば、bindは無くなり、現在ではonやlistenToが使われています。 その他の割りと新しい情報は Backbone.js Advent Calendar 2012 などにあります。 (追記ここまで) ネタ切れ感が否めないBackbone.js Advent Calendarですが、今回から何回かに分けて懇切丁寧な入門記事を書いていこうと思います。 以下のように書き進めていく予定です。 Events View Model ViewとModelの連携 Collection ViewとModelとCollectionの連携 RouterとHistory なおここで扱うBackbone.jsのバージョンは0.5.3です。 Backbone.jsのドキュメントを開くとまず最初に解説されているの
説明 指定した位置にあるエレメントを取得するにはdocument.elementFromPoint()を使います。パラメータにはX, Y座標を指定します。戻り値は指定した座標値にあるエレメントになります。Firefox 3以降、Safari 3以降、Opera 9以降、Internet Explorerで動作します。 サンプルプログラム <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <meta http-equiv="content-type" content="text/html;charset=utf-8"> <title>Sample</title> <link rel="stylesheet" href="css/main.css" type="text
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く