一定期間更新がないため広告を表示しています
by Russell Heimlich (@kingkool68) 600x400/000/fffSize / Background Color / Foreground Color . Format & Text DocumentationSizewidth x height Height is optional, if no height is specified the image will be a square. Example: https://dummyimage.com/300Must be the first option in the urlYou can specify one dimension and a ratio and dummyimage will calculate the right value. Example: https://dummyimage
前回に引き続き、ワイヤーフレームと完成サイトの比較みたいな記事をピックアップしてみます。 LEVEL STUDIOSという代理店で働く傍ら、個人事業主としてUXコンサルタントをしているAlexis氏のサイトにも制作したサイトとのワイヤーフレームが対で掲載されています。 Alexis Antonelli | User Experience Consulting | Activision.com 他にも Acura Fandango ShopNBC Honda のプロジェクトの簡単な説明とワイヤーフレームなどがあります。 こういったワイヤーフレームもポートフォリオに掲載しているケースはあまりないので、もっと出てくるといいのになあと思いました。 掲載されているワイヤーフレームは、合番と共に詳細なコメントもついており、こういった補足説明のつけかたによっては混乱のないワイヤーフレームが実現できそうで
2013年3月23日 Webサイト制作, 便利ツール Webサイトのデザインを始める前に、レイアウトやページ内で使われる機能を「設計図」として作っておきます。ワイヤーフレームと呼ばれるWebサイトの骨組みをしっかり作っておくと、デザインする段階でスムーズに仕事がすすみます。またクライアントとの打ち合わせでも大活躍。ここではワイヤーフレームを作る為の便利なオンラインツールと「ワイヤーフレームは手描き派!」という人のためのPDFテンプレートを紹介します。 ↑私が10年以上利用している会計ソフト! オンラインで使えるワイヤーフレーム作成ツール iPlotz iPlotzのWebサイト とにかく多機能でおすすめ。ワイヤーフレームを作る他にプロジェクトマネージメントもできます。オンラインでシェアしたり、JPG, PNG, PDFでの書き出し可能。 トライアルをするにはまずトップページから「Get S
サービス終了のお知らせ NAVERまとめは2020年9月30日をもちましてサービス終了いたしました。 約11年間、NAVERまとめをご利用・ご愛顧いただき誠にありがとうございました。
Creating wireframes and mock-ups is quite easy to do digitally these days. Applications are available everywhere, and there’s one for every style. While many prefer to do that part of the work digitally during the process, there are still quite a few designers who actually choose to do it the old-fashioned way using a Moleskine or other ways of drawing by hand. We all have our preferences and the
ワイヤーフレームを作るときに、とりあえず「どのソフト・道具を使って作ろうか」という考えが先に来てしまいますが、どのようなワイヤーフレームを作るのかのほうが重要です。情報をどれだけ見せるのか、何を表現したいかによってワイヤーフレームの見せ方が異なります。つまり、サイトの属性や目的に応じてワイヤーフレームの作り方を調整するとより効果的になります。また、予算や時間に合わせてワイヤーフレームを作成する目安にもなり、制作チームやクライアントとの情報共有がしやすくなる可能性があります。 ワイヤーフレーム制作は、主に5つのアプローチが考えられます。それぞれメリット・デメリットがあり、得意分野も異なります。複数を組み合わせたり、アレンジすることで目的にあったワイヤーフレームを作ることが可能になるでしょう。 コンテンツブロック型 内容や記載せず、おおまかなブロックで枠組みするワイヤーフレーム。サイト制作の早
ソフトウェアワイヤーフレーム 無料で使えるワイヤーフレームツールのまとめ Firefox 上で動作するワイヤーフレームツール Pencil をはじめ、無料でしかも便利なツールが増えてきました。紙とペンでワイヤーフレームを描くのは基本ですが、より本物に近いプロトタイプを作るのであればソフトウェアを使うのが最適です。以前紹介した「プロトタイピングの基礎の基礎」も併用に読んで今回紹介するツールの中から自分に合ったツールを探してみてはいかがでしょうか。 DIA: a drawing program UMLダイアグラムに特化していますが、ワイヤーフレームも作れます。基本的にデータは XML で保存されますが、EPS, SVG, PNG といった別形式にも書き出せます DENIM タブレットで操作すると快適そうなプロタイピングツール。サイト内をどのように移動するかを確認するには使えそうです OpenO
ワイヤーフレームとは「ページの大まかな見取り図」のことであり、この部分にはこのコンテンツ、というページ構成を示したものである。Web制作の案件では、比較的上流の工程でワイヤーフレームづくりを行い、その後にビジュアルデザインやインタフェース制作、(X)HTML+CSSページへの落とし込みの作業に入る。 コンテンツそれぞれをどこに配置するかという判断、いわゆる「情報アーキテクチャ」は、限られたスペースを有効活用するのに重要なだけでなく、ユーザービリティ(使いやすさ)やファインダビリティ(発見しやすさ)にも大きく関わってくる。ユーザー中心デザイン(User-Centered Design: UCD)という言葉を借りなくとも、Webサイトはユーザーに使ってもらってはじめて意味があるのであって、運営者とユーザー双方の満足が、車の両輪のようにサイトを動かし、発展させるのである。 特にトップページのワイ
前回でワイヤーフレームに含まれる基本的な機能とその名称が確認できた。具体的にページを起こすために、もう少しページの専用性に配慮した状態を考えねばならない。ページのホーム、つまりサイトのURLを叩いてアクセスする先頭のページと、ホームにぶら下がっているカテゴリのトップでは、含まれるべき機能に違いがある。これを専用性と捉えて考えるのだ。 余談だがホームページという呼び名には2通りの印象が結びついている事と思う。1つは前述の定義に沿った「サイトの入り口」という考え方、もう1つは「サイト全体」を示す考え方だ。前者の意味が正しい定義で、後者は「サイト」という意味の俗称と捉えていただきたい。よくテレビCMで「この商品のホームページはこちら」などと伝えているが、これは言い換えると「商品のウェブサイト」をより親しみやすくしている形だ。 グリッドで考える さて、必要な機能を自分が手がけるサイトに適応させてい
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く