[Generator] Responsible Social Sharing Buttons - ソーシャルボタンの一括ジェネレーター
[Generator] Responsible Social Sharing Buttons – ソーシャルボタンの一括ジェネレーター Pocket Tweet 各種ソーシャルメディアへの投稿ボタンを、一括で生成してくれるジェネレーター。Facebook, Twitter, Google+, Tumblr, Pinterest, LinkedIn, Redditの7つのサービスに対応してます。基本的にShare用のボタンなので、ボタンを掲載するページのURLとその説明文を入れるだけでオッケー。ボタンのサイズも3つから選べます。統一されたデザインのボタンをまとめて作れるので便利です。 Responsible Social Sharing Buttons
[Freebie] 22 Fresh Free Templates in HTML/CSS and PSD: February 2015 Edition - フリーのWebテンプレートやPSDモックアップまとめ
[Freebie] 22 Fresh Free Templates in HTML/CSS and PSD: February 2015 Edition – フリーのWebテンプレートやPSDモックアップまとめ Pocket Tweet フリーで配布されているWebテンプレートや、PSDモックアップなどをまとめた記事。2015年とあるのでごく最近のリソースでまとめた記事のようです。Webテンプレートはランディングページ系のものが多いようです。Webテンプレート以外にも、UIキットやNokia Lumiaのモックアップなどが紹介されています。新しめの素材探す時にイイかもしれません。アプリのページ作る時にいまだにiPhone 5のモックアップとか使ってると、ちょっとアレだったりしますしね。 22 Fresh Free Templates in HTML/CSS and PSD: Februar
[UI Design] Material Palette - マテリアルデザインに対応したカラーパレットツール
[UI Design] Material Palette – マテリアルデザインに対応したカラーパレットツール Pocket Tweet Googleの新しいデザインルールであるマテリアルデザインに準拠した、カラーパレット生成ツール。表示される各色の中から2色を選ぶと画面右側にプレビュー画面が出るので、それを見ながら配色を選ぶという仕組み。チョイスした色は画面右下の「Your Palette」エリア内に残るので、そこをクリックするとHEX指定で色の値をクリップボードにコピーできます。Androidアプリ作る際の配色決めに使えそうです。GoogleアプリのiOS版にもこのデザインルールは部分的に導入されつつあるので、Android AppっぽいUIのiOS Appを作る際にも使えそう。個人的にはiOSの文化にAndroidのルールを持ち込むのってあんまし好きじゃないですが。ハンバーガーメニュ
[Generator] Coolors - ランダム生成してくれるカラーパレット
[Generator] Coolors – ランダム生成してくれるカラーパレット Pocket Tweet ランダムにカラーパレットを生成してくれるジェネレーター。使い方は簡単で、スペースキーを押すだけで5色のカラーをランダムに変更してくれます。またこの際、キープしたい色をクリックするとロックでき、ロックされてない色のみを変更する事もできます。それだけの機能のシンプルなジェネレーター。またURLをコピーするだけでこのような形でパレットを他人と共有する事もできます。例えばキーカラー1色のみ決まってて他の色どうしようか迷ってる時なんかに便利そうですね。 Coolors
[UI Design] 20 Free and Fresh Mobile UI Templates - モバイルAppのUIテンプレートまとめ
[UI Design] 20 Free and Fresh Mobile UI Templates – モバイルAppのUIテンプレートまとめ Pocket Tweet Mobile AppのUIテンプレートをまとめた記事。多くはiOSをプラットフォームとして想定した作例です。iOS 7以降のフラットUIをベースとしたものが多いです。リンク先ではPSDで配布されてる場合が多いので、UIデザインをする際の素材探しとしても使えそうです。ユル目のグラデーション、ブラー、線画のアイコン。こういったものが今のデザイントレンドなんでしょうね。 20 Free and Fresh Mobile UI Templates
[Design] Starter Kit - 開発を始める際に便利なスターターキットをまとめたサイト
[Design] Starter Kit – 開発を始める際に便利なスターターキットをまとめたサイト Pocket Tweet WebやMobile Appなどの様々な開発を始める際に便利なスターターキットをまとめたサイト。紹介されてる内容がかなり幅広いんだけど、例えばiOSやAndroidなどのMobile Appの開発、Webのデザインに使えるHTMLやCSSの情報リソース、アイコンやイラストなどの画像素材、フォント、マーケティングリソース、SEO、ビデオ、UI / UX関連リソースなどがあります。サイト内の情報はタグ付けされて管理されているので、調べたい分野を絞る事ができます。ある程度知識があれば、いちから自分で作るよりもこうした素材やフレームワークを使った方が効率良く仕事できますしね。なかなかナイスなコンセプトのサイトだと思います。 Starter Kit
[Photoshop] 40 New Photoshop Tutorials to Learn Some Techniques - フォトショップを使ったチュートリアルまとめ
[Photoshop] 40 New Photoshop Tutorials to Learn Some Techniques – フォトショップを使ったチュートリアルまとめ Pocket Tweet Photoshopを使って作られた作例と、そのチュートリアルを50例まとめた記事。この手のまとめ記事であまり見たことがない作例が多かったので紹介。内容は様々で、ピクセルアート、テキストエフェクト、写真加工、グラフィックデザインなど色々あります。数が多いのでネタ探しにもいいし、アートワーク作る時に重宝しそうなまとめ記事でした。 40 New Photoshop Tutorials to Learn Some Techniques
[Typography] typespiration - Webタイポグラフィー作例のギャラリーサイト
[Typography] typespiration – Webタイポグラフィー作例のギャラリーサイト Pocket Tweet Webタイポグラフィーの作例をギャラリー形式で紹介しているサイト。各作例はどれも「見出し」「小見出し」「本文」「引用」という一般的な文書フォーマットで構成されており、また使われている色についてもHEX指定で一通り紹介されています。そしてCSSも一式見れるようになっているので、コードをコピペすれば近いデザインの文書をサクっと作る事もできます。いやこれナイスですね。ただしフォント指定は欧文圏のものなので、日本語のサイト制作に応用する際には置き換えた方が良さそうです。 typespiration
[Typography] 150+ Best Free Photoshop Text Effects Tutorials - フォトショップを使ったテキストエフェクトまとめ
[Typography] 150+ Best Free Photoshop Text Effects Tutorials – フォトショップを使ったテキストエフェクトまとめ Pocket Tweet Photoshopを使ったテキストエフェクトを150作例まとめた記事。数多いっす。各作例の「More Info」からチュートリアルページやダウンロードページに行く事ができます。スキューモーフィックなロゴデザインから、シンプルでフラットなタイポグラフィーまでいろんな作例が揃ってるので、テキストエフェクトのネタ探しの際に重宝しそうです。 150+ Best Free Photoshop Text Effects Tutorials
[Photoshop] 50 Photoshop Tricks for a Fast-Paced Work Environment - 作業を効率化するフォトショップのトリック
[Photoshop] 50 Photoshop Tricks for a Fast-Paced Work Environment – 作業を効率化するフォトショップのトリック Pocket Tweet 作業を効率化する、Photoshopのトリックという記事。ショートカットの表現がとても見やすいです（Macユーザー準拠です）。紹介されてる中からいくつかピックアップすると、透明度指定、ツールバー関連のショートカット、定規のオン・オフ、カスタムバインド、テキスト入力に関するTips、レイヤーやマスクに関するトリック、フルスクリーン表示やズームに関するショートカット、Optionキー特集（これ特に良かった）などがあります。いやこれなかなか役に立つ記事ですよ。Photoshopでの作業をできるだけ効率化したいショートカット厨の人にオススメです。 50 Photoshop Tricks for a
![[Photoshop] 50 Photoshop Tricks for a Fast-Paced Work Environment - 作業を効率化するフォトショップのトリック](https://cdn-ak-scissors.b.st-hatena.com/image/square/5ca98b090bc6cb54592df4c9db3104e536a3c20c/height=288;version=1;width=512/http%3A%2F%2Fmantiddesign.com%2Fimagearchives2014%2Fphotoshoptricks836346.jpg)
[Photoshop Plugin] 15 of the Best Time Saving Photoshop Plugins - 時間短縮に役立つフォトショッププラグイン
[Photoshop Plugin] 15 of the Best Time Saving Photoshop Plugins – 時間短縮に役立つフォトショッププラグイン Pocket Tweet 時間短縮や作業の効率化に役立つPhotoshop用プラグインをまとめた記事。様々な機能拡張が紹介されてて、多くは無料のものです。個人的には記事内1つ目で紹介されてるPixel2Vectorってやつが特に気になりました。最近じゃUIデザインでもWebデザインでもベクターデータを扱う機会増えたので。機能拡張ではないけど、自分の場合はSlicyとかが手放せないツールですね。もうこれなしでデザイン制作すんの無理ってくらい依存しちょります。 15 of the Best Time Saving Photoshop Plugins
![[Photoshop Plugin] 15 of the Best Time Saving Photoshop Plugins - 時間短縮に役立つフォトショッププラグイン](https://cdn-ak-scissors.b.st-hatena.com/image/square/eec30b028e2aa8d4e664ab368f7ed27cbdab295f/height=288;version=1;width=512/http%3A%2F%2Fmantiddesign.com%2Fimagearchives2014%2Fphotoshopplugins8612537.jpg)
[Typography] 40 Fresh Adobe Illustrator Text Effects - イラストレーターで作るテキストエフェクト作例まとめ
[Typography] 40 Fresh Adobe Illustrator Text Effects – イラストレーターで作るテキストエフェクト作例まとめ Pocket Tweet Illustratorで作るテキストエフェクトの作例まとめ。色々なタイポグラフィー作例が紹介されているので、ロゴデザインやグラフィックデザインの元ネタとしても良さそう。ちょうどついさっき「ロゴ作ってー」というオーダーが来たばかりなので、この記事からネタ拝借しようかなとか思っているところであります。お盆だってのに今年はなんだか忙しいな・・・。 40 Fresh Adobe Illustrator Text Effects
![[Typography] 40 Fresh Adobe Illustrator Text Effects - イラストレーターで作るテキストエフェクト作例まとめ](https://cdn-ak-scissors.b.st-hatena.com/image/square/58919dbbc040e7bb99cd875486f2cb6e3abb0836/height=288;version=1;width=512/http%3A%2F%2Fmantiddesign.com%2Fimagearchives2014%2Fillustratortexteffect82546.jpg)
[Prototyping] iOS 7 Wireframe Kit - iOS 7 Appを制作する際に役立つワイヤーフレームキット
[Prototyping] iOS 7 Wireframe Kit – iOS 7 Appを制作する際に役立つワイヤーフレームキット Pocket Tweet iOS 7用のアプリ制作の際に役立ちそうな、ワイヤーフレームキット。iOS 7の各種UIパーツのシンプルな絵が多数格納されています。Downloadボタンを押す事でファイル一式が落とせますが、様々なフォーマットが用意されてる点がとってもナイス。PNG、AI（イラレ）、Graffle（オムニグラフ用）、PDF、Sketch（Sketch用）が入っているので、多くのデザイナーやディレクターの使うツールに対応できそうです。 iOS 7 Wireframe Kit
![[Prototyping] iOS 7 Wireframe Kit - iOS 7 Appを制作する際に役立つワイヤーフレームキット](https://cdn-ak-scissors.b.st-hatena.com/image/square/9e390f70de92863be8f74090896f11d74955b732/height=288;version=1;width=512/http%3A%2F%2Fmantiddesign.com%2Fimagearchives2014%2Fios7uikit81653748.jpg)
[Mac App] Pixel Winch - UIデザインに便利なソフトウェア定規
[Mac App] Pixel Winch – UIデザインに便利なソフトウェア定規 Pocket Tweet ヤバいこれ超便利。スクリーンショットから、各UIパーツ間のスペースを測れるソフトウェア定規。Mac用のベータ版となります（製品版では有料化されるのかも）。立ち上げるとメニューバー右端に常駐し、そこからスクリーンショットをまずは撮影します。撮影するとディスプレイ全面を使って大きく拡大表示されるので、画面左上に出てくる各種ツールを使ってUIパーツ間の距離を測る事ができます。中でも特に便利なのが「Grapple Tool」。これを使うと画像内のコントラストを判断し、パーツとパーツの間の距離をセミオートで測ってくれます。いやこれめっちゃ便利です。UIデザインする人にとっては常用アプリになりそう。Webデザインでも使える機会が多そうです。 Pixel Winch
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
[Sketch, Photoshop] Craft - ダミーデータ入力に便利なSketch, Photoshop用プラグイン
[Web Design] CodeMyUI.com - Web制作に便利なコードスニペットを集めたサイト
[CSS3] AniCollection - CSSを使ったアニメーションのコードスニペット紹介サイト
[Sketch] Sketch Repo - Sketch関連のリソース紹介サイト
[Sketch] Yosemite UI Kit - Sketch 3用のYosemite UIキット
[Web Design] Showcase of Flat Web Designs - フラットWebデザインの作例まとめ![[Web Design] Showcase of Flat Web Designs - フラットWebデザインの作例まとめ](https://cdn-ak-scissors.b.st-hatena.com/image/square/8b31c903687e5311f404a5adcb399a410e139582/height=288;version=1;width=512/http%3A%2F%2Fmantiddesign.com%2Fimagearchives2014%2Fflatwebdesign375363.jpg)
