レスポンシブやらアイコンフォントやらフラットやら！2013年の気になる技術やデザインを試してみたリニューアル手順！ | バンクーバーのうぇぶ屋
誰でもできるiPhoneアプリのプロトタイプのつくりかた【サンプルつき！】
突然ですが、ペーパープロトタイプって知ってますか？ 実演ムービー 今まで気がつかなかった問題に気づけたりと、かなり強力な武器になります！ これをiPhoneの画面で気軽にできないかなー、お客さんに触ってもらったりできないかなーと思ってました。 ピンと来るやつが無かったので、作っちゃいました！ iPhone上で動く フルスクリーン対応（アプリによる） ファイルを開くだけなので、メールで送ったり共有も簡単！ 後からの追加、削除も柔軟に対応可能 デフォルトのUIを使わない場合のテストに真価を発揮します やり方は超簡単なので、今すぐに試すことができますよ！ 簡単なサンプルファイルも最後についてます！ それでは「続き」からどうぞー！ ペーパープロトタイプとは 新しい製品、サービスを開発するとき、スケッチを紙芝居の様に動かしながら、テストユーザーに触ってもらうことで使い易さや機能要求などを開発初期段階
5 Printable Templates for Sketching Responsive Layouts – Speckyboy
Sneakpeekit Responsive Sketchsheets If you’re a logo designer, font creator, or web designer, you’ll find that Sneakpeekit offers an excellent free solution for all your sketchsheet needs. Their platform provides a variety of mockup templates to assist you in designing responsive websites. Additionally, they offer grids that align with some of the most widely used grid systems and frameworks, incl
プロジェクトメンバーが幸せになれるワイヤーフレームの作り方 : LINE Corporation ディレクターブログ
こんにちは、livedoor Blog 担当の飯田です。 ちょうど新機能のワイヤーフレームを描いている最中だったので、今回は正解があるようで無いディレクターのメイン業務の一つ、ワイヤーフレームについて自分なりにどう考えて作っているかを簡単にまとめてみました。 特にワイヤーフレームをこれから初めて作ってみるという人の参考になればと。 ワイヤーフレームって？ ウェブサイトを構成する要素・動作をまとめた資料になります。構成書・モック・スケルトン・青写真と呼び方は人それぞれです。 ということで、実際以下の感じでワイヤーフレームを作っていきます。 とりあえず紙に描く 頭の中で考えていることをとにかく裏紙などを利用して紙に描いてみます。ワイヤーフレームと聞いてデジタルなイメージがありますが、こうした構想やアイデアベースの状態のときは、たくさん手を頭を動かして思いを出し切った方が整理がしやすくなります。
Webサイトの骨組み: ワイヤーフレームを素早く・手軽に・美しく制作する
2013年3月23日 Webサイト制作, 便利ツール Webサイトのデザインを始める前に、レイアウトやページ内で使われる機能を「設計図」として作っておきます。ワイヤーフレームと呼ばれるWebサイトの骨組みをしっかり作っておくと、デザインする段階でスムーズに仕事がすすみます。またクライアントとの打ち合わせでも大活躍。ここではワイヤーフレームを作る為の便利なオンラインツールと「ワイヤーフレームは手描き派！」という人のためのPDFテンプレートを紹介します。 ↑私が10年以上利用している会計ソフト！ オンラインで使えるワイヤーフレーム作成ツール iPlotz iPlotzのWebサイト とにかく多機能でおすすめ。ワイヤーフレームを作る他にプロジェクトマネージメントもできます。オンラインでシェアしたり、JPG, PNG, PDFでの書き出し可能。 トライアルをするにはまずトップページから「Get S
ForeUI
ForeUI is an easy-to-use UI prototyping tool, designed to create mockup / wireframe / prototypes for any application or website you have in mind. ForeUI is an easy-to-use UI prototyping tool, designed to create mockup / wireframe / prototypes for any application or website you have in mind. With ForeUI, your prototype project will be skinnable, since you can easily change the style of your prototy
Wireframes Magazine
I started a GoodUI YouTube Channel which includes a BetterUI video series. The idea for BetterUI is to review popular sites from the perspective of increasing conversions using some of the goodui.org ideas. As one example of a BetterUI video, here are 10 ideas for Uber.com’s Driver Signup screens. Additional videos will get added gradually over time. For each video I also try to express my level o
Photoshopでモックアップを作るためのTips10選 – creamu
Photoshopでサイトのモックアップが作りたい。 そんなときにおすすめなのが、『10 Tips For Creating Website Mockups In Photoshop』。Photoshopでモックアップを作るためのTips10選だ。 以下にいくつかご紹介。 フォントはアンチエイリアスをオフにする Windowsはアンチエイリアスがかからないので、オフで作成。 フォントには鮮明のアンチエイリアスをかける このアンチエイリアスが一番ブラウザのレンダリングに近い。11pxか12px以下の場合、ほとんどのブラウザではスムースフォントに対応していないため、アンチエイリアスはオフにした方がいいだろう。 （＊追記（08.09.13）コメントをいただいて気付いたんですが、完全に記事を読み間違えていましたm(_ _)m修正、及び追記します ） テキストはWebセーフフォントを使う MSゴシッ
【レポート】ハイクオリティサイトのワイヤーフレーム分析 (1) 他サイトのワイヤーフレームから学べること | クリエイティブ | マイコミジャーナル
ワイヤーフレームとは「ページの大まかな見取り図」のことであり、この部分にはこのコンテンツ、というページ構成を示したものである。Web制作の案件では、比較的上流の工程でワイヤーフレームづくりを行い、その後にビジュアルデザインやインタフェース制作、(X)HTML+CSSページへの落とし込みの作業に入る。 コンテンツそれぞれをどこに配置するかという判断、いわゆる「情報アーキテクチャ」は、限られたスペースを有効活用するのに重要なだけでなく、ユーザービリティ(使いやすさ)やファインダビリティ(発見しやすさ)にも大きく関わってくる。ユーザー中心デザイン(User-Centered Design: UCD)という言葉を借りなくとも、Webサイトはユーザーに使ってもらってはじめて意味があるのであって、運営者とユーザー双方の満足が、車の両輪のようにサイトを動かし、発展させるのである。 特にトップページのワイ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Wireframing over the shoulder | Konigi
http://www.designwalker.com/2009/04/wireframe-2.html
Underwear Showing (Web Design)