Photoshop作業が爆速＆快適に!!現役デザイナーがおすすめするスクリプトとプラグイン | 株式会社ウェブ企画パートナーズ
AdobeXDやIllustratorがWebデザインツールとして、どんどんと使いやすくなっていますが、まだまだPhotoshopでデザインする人が多いと思います。 かくいう私もメインのデザインツールはPhotoshop。そこで今回はPhotoshopの作業をより快適に行うために私が使っているおすすめのプラグインやスクリプトをご紹介いたします!! Photoshopを使い始めた新米デザイナーさんは是非ご参考ください。 スクリプトとプラグインの違い 紹介の前にプラグインとスクリプトの違いについて整理しておきましょう。 スクリプトはPhotoshopの複雑な作業を自動化してくれる Photoshopを使ってデザインをしていると同じ作業の繰り返しを行うことが多々あります。そんな時にPhotoshopの「アクション」機能を使えば、作業を自動化して行うことができます。便利ですね。 ただ、アクションで
Webページやスマホアプリにパノラマ画像のコンテンツを簡単に実装できる軽量スクリプト -Panolens.js
360度のパノラマ画像をブラウザ上で表示できる、軽量スクリプトを紹介します。 パノラマ画像を見るだけでなく、パノラマ動画、リンクコンテンツ、物語コンテンツなど、インタラクティブなさまざまなコンテンツを実装できます。 Panolens.js Panolens.js -GitHub Panolens.jsの特徴 Panolens.jsのデモ Panolens.jsの使い方 Panolens.jsの特徴 Panolens.jsはイベント駆動型で、WebGL対応のパノラマビューアーです。 パノラマは水平方向をはじめ、垂直方向・拡大縮小にも対応しています。 Three.JS（3Dフレームワーク）をベースに実装された軽量のスクリプトで、カスタマイズも優れています。 Panolens.jsのデモ デモではPanolens.jsで実装されたさまざまなパノラマを楽しめます。
フォームのinput要素に電話番号・日付・時間・金額など、数字のフォーマットを定義できるスクリプト -Cleave.js
クレジットカード番号・電話番号・日付・時間・金額などを入力するフォームのinput要素に、数字を区切ったり、記号文字を加えたり、入力する数字のフォーマットを簡単に定義できる軽量スクリプトを紹介します。 単体のスクリプトとしてだけでなく、Reactコンポーネント、AngularJSディレクティブでも利用できます。 Cleave.js -GitHub Cleave.jsの特徴 Cleave.jsのデモ Cleave.jsの使い方 Cleave.jsの特徴 Cleave.jsは、フォームのinput要素に入力する数字のフォーマットを簡単に定義できます。 クレジットカード番号のフォーマット 電話番号のフォーマット 日付・時間のフォーマット 数値のフォーマット 区切り文字、プレフィックス、ブロックパターン
【Photoshop】テキストの分割ツール - ツクロウヤ
ゲームのUI演出などで、VICTORYなどのテキストが波打つようにアニメーションするものがありますが、そういったものを作る際に、テキストをバラシて、それぞれの文字ごとに書き出すのが面倒くさい... ということで、Photoshopでテキストを一文字づつや行ごとにレイヤーを分割するツールを作ってみました。 ■機能概要 指定のテキストレイヤーを一文字づつや行ごとにレイヤーを分割 文字の横スケールやトラッキングなどの位置は保持。 元のレイヤーにかかっているスタイル保持 ※注意点 カーニングには対応していません。 文字の改行を行う場合、高さが自動に設定されていると値を取得できないため、 正常に高さを保つことが出来ません。改行を含む、高さを保ちたい場合は、行の高さを指定してください。 自動になっている場合は、警告を表示し、文字サイズで高さが変動するようになっています。 ■使い方 【スクリプトの準備】
[JS]デスクトップとスマホの両方に対応！さまざまなパララックススクロールを実装できるスクリプト -basicScroll
Webページやスマホアプリで、ユーザーがスクロールした位置に応じてCSSアニメーションを簡単に適用できるパララックススクロールを実装する軽量スクリプトを紹介します。 単体で動作するので、非常に便利だと思います。 basicScroll basicScroll -GitHub basicScrollの特徴 basicScrollのデモ basicScrollの使い方 basicScrollの特徴 basicScrollではスクロール位置に応じてCSSを変更でき、CSSの変数を利用してアニメーションを適用します。スクロールで同時に表示された要素に対しても別々のアニメーションを簡単に設定でき、JavaScriptを使用してアニメーションをさらに制御できます。 basicScrollの特徴 他のスクリプトへの依存はゼロ CommonJSとAMDのサポート シンプルなJavaScript API ブ
![[JS]デスクトップとスマホの両方に対応！さまざまなパララックススクロールを実装できるスクリプト -basicScroll](https://cdn-ak-scissors.b.st-hatena.com/image/square/50650661e7354b2848147a7358b8dfe4f3f2931c/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201801%2F2018022111-01.png)
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
イラストレーターのテキストフレームを行ごとに分割したり統合したり - なにする？DTP+WEB