RWD施行時に使える、デバイス毎のモニターサイズを視覚的に把握できるチートシート・「Responsive Web Design Cheat Sheet」 Responsive Web Design Cheat Sheet Responsive Web Design Cheat SheetはレスポンシブWebデザインの施行時に使えるモニターサイズのチートシートです。各メジャーなデバイスを...2014.01.19 | 11時12分02秒
iPadやiPhoneなどのデバイス向けのフラットデザインなモックアップ用素材・「Flat Apple’s Devices Mockup」 Flat Apple's Devices Mockup Flat Apple's Devices MockupはiPadやiPhone、Macbook等のApple製デバイス向けに作られたフラットデザインなモックアップ素材です。PSD...2014.01.07 | 10時30分59秒
スマフォ向けの美しいデザインのUIキット・「Flatastic Mobile UI Kit」 Flatastic Mobile UI Kit Flatastic Mobile UI Kitはスマフォ向けの美しいデザインのUIキットです。よく使われるインターフェースは勿論、スマフォならではのUIなども含まれています。見やすくてい...2013.12.06 | 11時36分48秒
ダミーテキストやダミーのユーザー名を作成出来る国産ツール・「DummyObject」 DummyObject ご連絡頂いたのでご紹介。DummyObjectはダミーテキストやダミーのユーザー名を生成出来る国産ツールです。ダミーテキストは青空文庫にある類のものを字数指定で生成出来ます。ダミーユーザーは人物名を漢字、ひらが...2013.11.01 | 10時35分46秒
サンプルデータを手軽に作成出来るオンラインツール・「generatedata.com」 generatedata.com generatedata.comは名前や住所等のデータのサンプルを生成してくれるオンラインツールです。HTMLのテーブルやリストなどのテストに役立ちそうですね。データのタイプもかなり豊富に揃えられてい...2013.10.15 | 9時44分03秒
RWDのワイヤーフレームを作成出来る・「Responsive Wireframes」 Responsive Wireframes Responsive WireframesはRWD向けのWebサイトのワイヤーフレームを作成出来る、というツール。画面サイズを見ながらレイアウトを作ることが出来ます。凝ったことは出来ませんが...2013.09.23 | 10時40分06秒
WebサイトのスクリーンショットをiPhoneやiPad、Androidなどを模したイラストと合成できる・「MockUPhone」 MockUPhone MockUPhoneはiPhoneやiPad、Androidなどを模したイラストにスクリーンショットを合成出来る、というモックアップツール。そのデバイスで閲覧しているような画像を手軽に作ることが出来ます。 ...2013.08.04 | 11時04分09秒
HTML5製のオンラインモックアップツール・「mocknow」 mocknow mocknowは、HTML5で作られたオンラインモックアップツール。出来る事はシンプルですけど、最低限の事は出来るみたい。サイズの変更がちょっと分かりにくいんですけど右下で変更できます。こちらを選択するかどうかは置...2013.07.12 | 10時48分12秒
レスポンシブWebデザイン用のモックアップを作成できる・「FROONT」 FROONT FROONTは、ブラウザでレスポンシブWebデザインに対応したWebサイトのモックアップを作成出来るサービス。ドラッグ&ドロップを基本操作としているので手軽に作成できそう。利用にはユーザー登録が必要です。 FROO...2013.05.25 | 10時30分29秒
Andoroidアプリ用プロトタイプを作成する為のHTML/CSSフレームワーク・「Fries」 Fries Frieshは、HTML/CSS/JavaScriptベースで作る、Androidアプリ用プロトタイプ作成フレームワーク。RATCHETに刺激されてAndorid向けも作成したくなった、との事らしいです。ライセンスはMIT...2013.05.13 | 10時20分13秒
PNGやEPS形式のワイヤーフレーム作成用キット・「WIRED」 WIRED WIREDはワイヤーフレームを作成するためのメディアファイルキットです。Webサイトでよく利用される様々なコンポーネントの素材がパッケージングされています。また、iPhone5用の素材もあるみたいです。 WIRED2013.04.26 | 10時26分31秒
国産のダミー画像生成サービス・「Placehold.jp」 Placehold.jp Placehold.jpは国産のダミー画像生成ツールです。画像サイズや任意のテキスト、背景やテキストカラーの変更や、JSONを使ったCSSによるカスタマイズなども可能です。 Placehold.jp2013.04.16 | 12時24分09秒
ダミー画像を手軽に作成する・「PlaceIMG」 PlaceIMG PlaceIMGはダミー画像生成サービスです。マウスでスライダーを動かしてサイズを決めたり、数値でサイズを指定、ダミー画像のカテゴリの指定、フィルターでセピアやモノクロ化なども出来ます。 PlaceIMG2013.04.13 | 10時10分49秒
PNGやPSDファイルとしてエクスポートできるグリッド生成ツール・「Modular Grid Pattern」 Modular Grid Pattern Modular Grid PatternはPNGやPSD形式でエクスポートできるグリッド生成ツールです。幅やカラム数を指定してダウンロードするだけ。PhotoShopのエクステンションもあるみ...2013.03.31 | 11時42分05秒
CSS3を使ったエレメントを簡単に作成出来るChrome拡張・「CSS-SHACK」 CSS-SHACK CSS-SHACKはChromeでCSS3を使ったエレメントを作成できるアプリケーションです。右のツールボックスで装飾するとリアルタイムで反映、そのままソースをエクスポートできるようになっています。レイヤー機能も付...2013.03.28 | 12時56分02秒
猫の画像をダミー画像として使える・「{placekitten}」 {placekitten} {placekitten}は猫の画像をダミー画像として利用出来るツールです。URLでサイズやモノクロ指定をするだけでダミー画像が表示されます。 {placekitten}2013.03.23 | 12時00分47秒
動作も軽く使いやすいモックアップ作成ツール・「Moqups」 Moqups Moqupsは動作も軽く、直感で使えるモックアップ作成ツールです。ドラッグ&ドロップで楽に操作することが出来て、基本的な機能も全て揃っています。ただし、画像をアップロードするにはユーザー登録が必要となります。 Mo...2013.03.11 | 10時59分14秒
PDFのグラフ用紙をオンラインで生成出来る・「Paperkit」 Paperkit Paperkitは、オンラインでグラフ用紙を生成出来るツール。サイズ、グリッドの幅や色を指定。PDFはBase64形式で発行されます。 Paperkit2013.03.04 | 10時02分52秒
様々なWebサイトのワイヤーフレームを紹介する・「Wireframe Showcase」 Wireframe Showcase Wireframe Showcaseは様々なWebサイトのワイヤーフレームを紹介するギャラリーサイト。実際に公開されているサイトとそのワイヤーフレームをギャラリーとして紹介しています。 Wi...2013.02.21 | 18時54分49秒
ダミー画像を簡単に生成出来る・「placebox.es」 placebox.es placebox.esはURLからダミー画像を生成出来るWebツール。サイズや色を指定すれば、その設定に見合ったダミー画像が表示される。 placebox.es2013.02.20 | 21時37分00秒
iPhoneのモックアップを作成・「iPhone Mockup」 iPhone Mockup iPhone MockupはオンラインでiPhone向けサイトやアプリのモックアップを作成できるツール。手書き風、イラスト風のスタイルを選択できます。多機能では有りませんが、サクッと作りたいときは便利です。...2013.02.20 | 16時38分25秒
Fireworksライクなモックアップ作成ツール・「Stylo」 Stylo StyloはFireworksっぽいUIのモックアップ作成Webツール。現在はCWebkitのみ対応。Githubでもソースが公開されています。 Stylo On github2013.02.20 | 0時54分09秒