Googleが、ローカルベースのプロトタイピングツールPixateを買収した模様。以後、Pixateアプリは無料となり引き続き開発が続けられるようです。 2013年頃、Pixateに$600払ってた俺は泣いた。おめでとうございます。 Invisionを主流に百花繚乱の分断化で割と困っていたプロトタイピング業界。Googleがこの分野に手を出したことで変動は起きるのだろうか。 これがプロトタイピングツールの決定版になるとよいですね。高性能だし無料だし。クラウド版も$5だし。 日本でプロトタイピングサービスばパッとしない究極の問題は、サービスがオンラインのことなんですよね。SI系の人たちは「セキュリティ的な事情でオンラインの共有サービスを使えない」という事情がありました。Pixateはローカルアプリなので、その辺の心配をする必要がないのがポイントですね。そのうち大手SIとかでもこういうツールが

ウェブサイトをデザインをするときに、ワイヤーフレームを作るのって 私にとっては「どこに何を置いて、どういう動きをするのか」というメモのようなもので。 手描きでレポート用紙に描いて、 スキャンしてプロジェクトフォルダへ入れておくことも多いのですが デザインの前に「こういう配置でいいですよね？」って共有したいとき 清書するアプリを時々探してしまうんですよね。まだしっくりくるものがなくて。 最近調べてすごいなーとおもったアプリや、無料でもざくざく使えそうなものまでご紹介。 Moqups Free Plan (offers 2 active projects and 5MB of storage) Monthly：Standard active project 10 で $9〜 ログインしなくても無料で組めます。 960gsグリッド表示可能です。 ほぼコンポーネント揃ってます。ほぼ装飾なしなステン

TOP  >  Design  >  web・スマートフォンアプリ設計に役立つ ワイヤーフレームUIキット「18 Free UI and Wireframe Kits」 デザイン制作を行う際にはまず、全体の設計を行うためにワイヤーフレームを使って構成を考えることが多いと思いますが、本物のイメージにより近づけるため、また提案としてクライアントに提出するために、より現物に近いものをできれば作っておきたいもの。そんな時に役立つワイヤーフレームUIキット「18 Free UI and Wireframe Kits」を今回は紹介したいと思います。 webやスマートフォンアプリの設計をスムーズに進めることができそうな、制度の高いワイヤーフレームが揃っています。 詳しくは以下 Dribbble – A_better_look.jpg by Chris Bannister 定番のレイアウトのwebサイト制

先日、Goodpatch代表の土屋がWebSig会議というイベントで講演をしました。講演は「ハートに響くUIを生み出すためのデザインプロセス」というタイトルで行われ、起業までのストーリー、GoodpatchのUI設計プロセスなどについて話しました。講演内容は↓のslideshareを参照してください。 その講演の中でGoodpatchはデザインする際にプロトタイプを作成していると話しました。以前にMEMOPATCHでもインタラクションや導線の動きを伝える上でプロトタイプ作成が重要という趣旨の記事をアップしています。 （参考: これからのUIデザインのために、デザインカンプをやめてプロトタイプを作ろう（前編）, （後編）） プロトタイプ作成というとHTML, CSS, JavaScriptで実装する方法がメジャーかと思いますが、これだとリソースをかなり割くことになってしまいます。そこで今回は

【ぷにぷに】今買える課金コインをまたまた全部買って引く!!【ゆっくり実況 ホロライブコラボ 妖怪ウォッチ】

Moqupsは動作も軽く、直感で使えるモックアップ作成ツールです。ドラッグ&ドロップで楽に操作することが出来て、基本的な機能も全て揃っています。ただし、画像をアップロードするにはユーザー登録が必要となります。 Moqups

デスク配線がスッキリ。Ankerの全部入り12 in 1モニタースタンドが突然8,250円OFFされてた #Amazonセール

LocalStorageを使用したモックアップ の作成ツールのご紹介。シンプルで 軽量なので使いやすいです。見やすい し、D&Dで操作出来ます。手軽で使い やすいのは素敵ですね。プレゼン用 なんかにもいいかもしれません。 シンプルなモックアップ作成ツール。githubでもソースが公開されています。Backbone.jsやLocalStorageで作ったそうです。 左のエリアからシェイプやフォームのパーツをドラッグして方眼紙の箇所にドロップする、という普通の流れで作成します。マウスでリサイズやテキストの変更も容易に行えます。 日本語も問題なし。要素を選択すれば下部で変更出来る様になっています。 エクスポートはPNGで発行されます。自分好みにカスタマイズして使うのも良いのでは。 mockup-designer

ワイヤーフレームを手軽に作れる、 というWebサービス。ユーザー登録 も不要です。URLが発行されるので 教えるのも丁度いいかも。ただ、 凄く高機能、というものではない のでイメージを伝える、みたいな 用途になりそうです。 個人的には軽量でユーザー登録不要、直感で作成出来る点、URLが発行される、という点が気に入りました。 こんな感じ。ドラッグで範囲を決めてエレメントを選定するだけ。メモも残せます。 背面、前面設定なども出来ます。 機能はシンプルながら、最低限欲しい物は揃っていて、操作性も良い感じです。URLさえ分かれば誰でも編集できてしまうので、場所の離れた方とのレイアウトの打ち合わせ等、簡易的な用途として使うのもいいかもしれないです。 Wireframe.cc

2014年8月17日 Webサイト制作, 便利ツール WebクリエイターボックスではWeb制作の応用技術をよく紹介していますが、基本の流れはちゃんと説明していないな…ということで、「連載！実践で学ぶWebサイト制作ガイド」として、実際に1つのサイトを作りながらWeb制作の流れと方法をまとめて書いてみることにしました。この連載企画はブログ開始当初に考えていましたが、2年半ほど忘れてました…。今回は「ワイヤーフレームの作り方」です。これも過去に「Webサイトの骨組み: ワイヤーフレームを素早く・手軽に・美しく制作する」という記事を書いていたのですが、私の使用するツールも変わったので、改めて記事にすることに。 ↑私が10年以上利用している会計ソフト！ 実践で学ぶWebサイト制作ガイド：その3 目標：わかりやすいワイヤーフレームを作成することができる 必要なもの：紙とペン 対象レベル：超初心者OK

TOP  >  Design , Photoshop  >  ワイヤーフレーム制作のための素材セット「The Ultimate Wireframe UI Kit」 サイト制作の前に制作するワイヤーフレーム。サイトの構成や構造をわかりやすく事前に見せるためには非常に有効な手段ですが、作る精度によってはかなりの時間を費やしてしまうこともあると思います。今日紹介するのはそんなワイヤーフレームを制作する時間を短縮してくれる、素材セット「The Ultimate Wireframe UI Kit」です。 ローディング、ボタン、グローバルメニューなどなど、サイトにひつようなパーツが、数多く収録されており、それらを組み合わせえてりようすることで切り貼りでサイトのワイヤーフレームを作ることができます。 詳しくは以下 かなりの種類のインターフェースのパーツが収録されており、その数は60にものぼります。データ

結構良かったのでご紹介。スマフォ やタブレットなどのモックアップを 直感で作成出来るWebサービスです。 かなり簡単に作れるので選択肢の 一つとして覚えておくといいかもし れません。 有料ですが、結構良さそうなモックアップツールです。動作も軽くてサクサク作れます。 有料のモックアップツール。最安で月/29USDとなかなかの値段ですが、それに見合う機能だなぁとは思います。 パッと見、地味ですけど・・機能は結構凄い。触って頂くと直感で作成出来るのが実感できると思います。操作はドラッグでパーツを持っていって配置するだけ。Cacooを使う感覚に近いかも。※個人の感想です ↑ パーツは各種デバイスのものが用意されていますが、アップロードも可能です。アップロードはユーザー登録が必要です。 ↑ 何個も同時に作れます。ダブルクリックで新規モックアップ作成です。 ↑ 作ってて楽しい。 他、アニメーション遷移

TOP  >  Design , Photoshop  >  モックアップ制作に最適!ブラウザのパーツpsd「Browser Form Elements PSD」 前回で「iPhoneのユーザーインターフェイス素材集「iPhoneのユーザーインターフェイス素材集「iPhone GUI PSD」」という記事でiphoneのインターフェイス素材を紹介しましたが、今回紹介するのはiphoneの素材集と同じく「teehan+lax」で公開されているブラウザのインターフェイスのパーツを集めたpsd素材「Browser Form Elements PSD」です。 このpsdにはラジオボタン、フォーム、カーソルｍアイコンなどなど様々なデータが収録されています。WEBデザインのモックアップを実際に近い形で見せるには便利なデータだと思います。 詳しくは以下 ブラウザを取り入れたデザインだったり、パロディ作品

結構便利そうだったのでご紹介。オンライン でWebサイトの簡単な設計図、いわゆる モックアップをドラッグ&ドロップ、直感で作成 出来て、PDFやJPGで保存出来るフリーの Webサービス、lumzyのご紹介。ユーザー 登録不要というのが良いですね。 日本語もある程度使えて（ボタンのテキストなどには使えないです）、PDFで保存しても文字化けせず、しかもユーザー登録も不要なので結構重宝しそうな気がします。 「モックアップはきれいに作りすぎてはいけない、という話」という記事でもありますが、手書きのような感覚でスピーディに作れるので件の記事内容に沿ったモックアップの作成が出来そう。 lumzy ユーザー登録不要と言うのが手軽でいいですね。それでいて結構高機能なので侮れません。以下に簡単に使い方を。 プロジェクトを作る まず、プロジェクト名を決めます。決めなくてもモックアップは作成出来ますが、決めな

Make 24 monthly payments Pay 0% interest Start using the domain today. See details