タグ

スライスに関するharu135のブックマーク (12)

  • HTML/CSSコーディング時間を激減させる「Creative Cloud Extract」と、その真価を引きだすための10のポイント

    CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

    HTML/CSSコーディング時間を激減させる「Creative Cloud Extract」と、その真価を引きだすための10のポイント
  • Slicyはあっと驚くほど便利だった。 - colopixie

    Slicyは、PSDをD&Dするだけで、Photoshopでレイヤーやフォルダに指定した方法で名前をつければ書きだしてくれるアプリです。 これがめっちゃ便利!驚いたたまげた。 App Storeで買いました。 今回は、Slicyの公式のデモファイルを使って、解説していきます!ちょうべんり! 公式のデモファイルは、下記からダウンロードできます(いきなりZIPダウンロードになります) 通常 (Basic Tagging) 「Basic Tagging」のフォルダーを開き、PSDを開いてみましょう。 PSDを開くと、フォルダーやレイヤーに”.png”や”.jpg”など追加します。 そうすると・・・? そのPSDを”Slicy”にドラッグアンドドロップすると、ぽこん!と先ほどの”.png”のついたフォルダーやファイルが出てきます。 これを上の”Copy”を押して全て保存するか、個別のファイルをドラ

    Slicyはあっと驚くほど便利だった。 - colopixie
  • コーディングしにくいデザインをHTMLとCSSのみで組んでみた(前編)

    コーディングしにくいデザインをHTMLCSSのみで組んでみた(前編) 2011-01-02 いつも通りデザイン系のサイトを見てると、 "Fresh Examples of Web Design and Interfaces" という記事を見つけました。 綺麗だけど、コーディングが難しそうなデザイン。コーダーにとってドSなデザインです。 そしてtwitterでこんなことをつぶやいてみました。 そしたら、"ぜひ"いう声があったので、ノリでやってみました。 実際にやってみるにあたり。 先ほどのサイトからデザインを選ぶことになったのですが、著作権的に問題があったので、先ほどのサイトからインスパイヤーしたデザインを自分で作ることにしました。 こんなんにした。 コーディングする前に コーディングの方法は様々あります。 自分の中で以下のようなルールを設けました。 ブラウザの対応はIE6-8, 最新モダ

    コーディングしにくいデザインをHTMLとCSSのみで組んでみた(前編)
  • illustratorのaiデータから画像を綺麗にスライスする方法|Web Design KOJIKA17

    illustratorのaiデータから画像を綺麗にスライスする方法 2011-01-08 illustratorのaiデータをWeb用の画像にスライスすると、画像が1pxズレが生じたり、Photoshopのスライス機能と違うので戸惑うことが多いと思います。 関西の某勉強会の懇親会でも「外注に頼んだデザインがaiデータで来て、スライスに凄い時間がかかった」という意見が多く聞いたので、illustratorのスライスの仕方をご紹介させて頂きます。 紹介するillustratorのバージョンはCS2ですが、CS以降のバージョンならほとんど機能が使えるはずです。 スライスの準備 単位 [ファイル]→[ドキュメント設定]で単位がピクセルになっているか確認します。 ここを変更すると、定規などの値も全てピクセルになるはずです。 カラーモード [ファイル]→[ドキュメントのカラーモード]がRGBカラーにな

    illustratorのaiデータから画像を綺麗にスライスする方法|Web Design KOJIKA17
  • MacRabbit was here

    Here hopped MacRabbit. Makers of some damn good software. Apps that shone bright and some that never saw the light. Norbert the magical rabbit was never real, but the magic was. Espresso and CSSEdit acquired by, alive and kicking at Kangacode Fifteen Crazy Years: A Toast to Life What a wild space carrot ride... Thanks for all the memories, lovely people. Signing off, Jan (this guy, also on Twitter

  • Photoshopのプラグイン、Cut&Slice meはコーダーの強い味方になるか試してみた

    Photoshopのプラグイン、Cut&Slice meはコーダーの強い味方になるか試してみた 2013.01.07 | この方法お勧めです! はじめまして。お弁当に入れてよし、おにぎりの具にもよし、卵はイクラでお寿司によし、年末にはまるごと新巻鮭で贈答品にもよし、いろんな形でお役に立つ、そんな鮭のような存在になりたいサーモンです。 決していしん坊だから、とか、もう選ぶ色がなかったとかそんなことではないですよ。 今日は七草 お正月、冬休み明けで、今日が仕事始めの方も多いのでは、と思いますが、そんな今日、1月7日は「七草粥」の日です。 1月7日の朝にセリ、ナズナ、ゴ(オ)ギョウ、ハコベラ、ホトケノザ、スズナ、スズシロの「春の七草」を入れたおかゆをべて、無病息災を祈る、という行事ですね。地域によっても少しずつ違うのかもしれませんが、私の住む関東地方ではこんな感じだと思います。 そして、正月

    Photoshopのプラグイン、Cut&Slice meはコーダーの強い味方になるか試してみた
  • Slicing Images for Your Website with Photoshop

    2014年8月17日 Photoshop, Webサイト制作 印刷物のデザインではそのまま印刷すればいいのですが、Webサイトの場合は出来上がったデザインをパーツごとに画像をスライス(分割)し、HTMLCSSで組立ててWebサイト上に表示します。「実践で学ぶWebサイト制作ガイド」5回目ではそのスライス作業に注目!私は普段Fireworksを使ってスライスしていますが、ここでは前回と同様Photoshopを使ったスライス方法を紹介します。実践に入る前に、いくつかのポイントもおさえておきましょう。 ↑私が10年以上利用している会計ソフト! 実践で学ぶWebサイト制作ガイド:その5 目標:コーディングしやすいパーツ画像を用意できる 必要なもの:Adobe Photoshop 対象レベル:Photoshopの基的なツールの使い方がわかる 目次 誰のため?何のため?Webサイトを作り始める前に

    Slicing Images for Your Website with Photoshop
  • コーディングする時のスライス方法とか - CSS HappyLife

    珍しく、Photoshopネタでも。 コーディング関係だからこのブログの主題っぽい! 今回は、PhotoshopCS6を利用したスライスに関するアレコレです。 コーディング時にはスライスは必須ですし、一番面倒な部分なので少しでも効率良くスライス出来ると良い感じですよね。 内容としては、スライスの基からって訳じゃないので、最低限スライスツールが使えてる方を対象にしたような感じになってると思います。たぶん。 ちなみに、面倒な説明しなくていいから分かりやすい様に動画ベースでやっていきます! Photoshopを起動します 何はともあれ、Photoshopを起動します。 これはすごく重要な作業です。 Photoshopは重いので起動するのがダルいですね。ウチのVAIO Zが頑張ってます。 CS3の頃はサクサクで良かったんですが。 起動したら、psdファイルを開きましょう。 普通のスライス まずは

    コーディングする時のスライス方法とか - CSS HappyLife
  • Photoshop使い必見!Fireworks風のスライス機能をPhotoshopで効率的に使いこなす | サイブリッジラボブログ

    TOP > WebDesign > Photoshop >  Photoshop使い必見!Fireworks風のスライス機能をPhotoshopで効率的に使いこなす こんにちは、Roadyです。 最近あまり自転車に乗れていませんが、季節も春! 仕事自転車もガンガンこなしていきたいと思います。 さて今回は「Fireworks風のスライス機能をPhotoshopで効率的に使いこなす」をテーマにお話ししたいと思います。 スクリプトのダウンロード 下記リンクからダウンロードができます。 fw_slice.jsx アクションへの登録(ついでにショートカットも登録!) デフォルトですとスライスを切るごとにスクリプトを読み込まないといけないので、アクションへ登録しつつ、そのアクションをショートカットで実行できるように設定することでさらに効率化を図れます。

    Photoshop使い必見!Fireworks風のスライス機能をPhotoshopで効率的に使いこなす | サイブリッジラボブログ
  • [Photoshop CS5]スライスツールをもっと便利に使って、効率よくWeb用保存をする-初心者のためのWEBデザイン教室

    Webデザイン、Webサイト作成の流れ、Adobeソフト操作のちょっとしたコツ、SEOなど、ホームページを自分で作りたい初心者の方に分かりやすく解説します。 こんにちは!初心者のためのWEBデザイン教室、第13回目の授業です。 WEBサイトのデザインをPhotoshopで作成した後、「で、次にどうしたらいいんですか…?」とよく聞かれます。 スライスツールで、HTMLに組み込むために画像をパーツに分ける、ということは学習するのですが、実際に自分の作ったデザインデータを前にすると、テキストの課題とは勝手が違いますよね。 では今日は、このスライスからWEB用保存までの作業について具体的に学びましょう! スライスツールでスライスする スライス選択ツールでスライス定義をする 切り出したい画像以外の部分が入っている場合は、そのレイヤーを非表示にする [Webおよびデバイス用に保存]ダイアログで、各スラ

  • 暮らしの情報サイトnanapiはサービスを終了いたしました | nanapi [ナナピ]

    2020年8月31日(月)をもちまして、nanapiに関わるすべてのサービスは終了いたしました。 nanapiは、2009年のサービス開始より「みんなで作る暮らしのレシピ」という考えのもと、ユーザーの皆さまに生活に関する様々な「ハウツー」を投稿していただく投稿型ハウツーサービスとして運営してまいりました。 約11年間にわたって皆さまからご支援をいただきサービスを継続できたこと、nanapi編集部一同、心より御礼申し上げます。 掲載されていたコンテンツなどのnanapiについてのお問い合わせは、nanapi@supership.jp までお願いいたします。 長きに渡りnanapiを応援してくださり、当にありがとうございました。

  • http://kb2.adobe.com/jp/cps/224/224107.html

  • 1