ブラウザのローカルストレージを使用して、直観的なインターフェイスでモックアップを簡単にさくさく作れるオンラインツールを紹介します。
ブラウザのローカルストレージを使用して、直観的なインターフェイスでモックアップを簡単にさくさく作れるオンラインツールを紹介します。
The Ultimate Website Builder for Mac, iPad & iPhone Blocs is fast, intuitive and powerful visual web design software, that lets you create responsive websites without writing code. Blocs for MacBlocs for iPadBlocs for iPhone Learn Get up and running fast with our learning portal. You'll find everything you need to master building websites with Blocs. Learning Portal Connect Connect with other Bloc
Webサイト設計図 - ワイヤーフレームの作り方WebクリエイターボックスではWeb制作の応用技術をよく紹介していますが、基本の流れはちゃんと説明していないな…ということで、「連載!実践で学ぶWebサイト制作ガイド」として、実際に1つのサイトを作りながらWeb制作の流れと方法をまとめて書いてみることにしました。この連載企画はブログ開始当初に考えていましたが、2年半ほど忘れてました…。今回は「ワイヤーフレームの作り方」です。 実践で学ぶ Web サイト制作ガイド:その 3目標:わかりやすいワイヤーフレームを作成することができる必要なもの:紙とペン対象レベル:超初心者 OK!目次誰のため?何のため?Web サイトを作り始める前に。Web サイトの構成図を簡単に作れる便利ツールWeb サイト設計図 - ワイヤーフレームの作り方 ← 今ここPhotoshop で Web サイトのデザインをしようP
レスポンシブのプレゼンや企画書に最適!各デバイス用のキャプチャを簡単に埋め込める親切丁寧なPSD素材 -Responsive Showcase PSD
Sketching is a technique mainly used by designers for web design and graphic design projects. There are times you get stuck and frustrated in design process of a website so a piece of paper and a pencil will be a great helper for you.Sketching will help you stay focused on designing websites or blogs.Many of you may think website sketching is an old school but it is a proven method to visualise fi
突然ですが、ペーパープロトタイプって知ってますか? 実演ムービー 今まで気がつかなかった問題に気づけたりと、かなり強力な武器になります! これをiPhoneの画面で気軽にできないかなー、お客さんに触ってもらったりできないかなーと思ってました。 ピンと来るやつが無かったので、作っちゃいました! iPhone上で動く フルスクリーン対応(アプリによる) ファイルを開くだけなので、メールで送ったり共有も簡単! 後からの追加、削除も柔軟に対応可能 デフォルトのUIを使わない場合のテストに真価を発揮します やり方は超簡単なので、今すぐに試すことができますよ! 簡単なサンプルファイルも最後についてます! それでは「続き」からどうぞー! ペーパープロトタイプとは 新しい製品、サービスを開発するとき、スケッチを紙芝居の様に動かしながら、テストユーザーに触ってもらうことで使い易さや機能要求などを開発初期段階
既存WEBサイトからワイヤーフレームを生成し、デザインワークに役立てられうブックマークレット「Wirify」 2010年12月24日- Volkside | Introducing Wirify: The web as wireframes 既存WEBサイトからワイヤーフレームを生成し、デザインワークに役立てられうブックマークレット「Wirify」 専用ソフト等は一切必要なく、ブックマークレットに追加するとページをワイヤーフレーム化してくれます。 たとえば、New York Times は下図のようにワイヤーフレーム化できます。 既にレイアウトの仕方はWEBに出尽くしているはずなので、想像するサイトデザインに類似のサイトを見つけてワイヤーフレーム化し、そこからリデザインし、デザインを作るというような効果的な活用法が考えられますね。 当ブログもやってみると次のようにワイヤーフレームにすること
WEBからスマートフォンまでワイヤーフレームのための素材キット30選「30 Fresh Web UI, Mobile UI and Wireframe Kits」 WEBサイトを制作するために作成するワイヤーフレーム。サイトの作りを決定する重要なものです。作り方は制作する人によって大きく変わると思うのですが、今日はワイヤーフレームをより簡単に作成するための素材キットを集めたエントリー「30 Fresh Web UI, Mobile UI and Wireframe Kits」を紹介したいと思います。 Website Wireframes Kit for Adobe Fireworks (.png) 手書き風のものから、キッチリ作られたものまで様々な素材キットが紹介されています。今日はその中から幾つか気になったものをピックアップして紹介したいと思います。 詳しくは以下 ■Wireframe
モックアップを作成したい。 そんなときに使えそうなのが、『MockFlow』。モックアップ作成AIRアプリです。 元々Webサービスでモックアップ / ワイヤーフレームを作成・共有できたMockFlowですが、そのAIRアプリが出たようですね。Web版と連携しているようです。 UIが洗練されていて、使っていて気持ちいいですね。コンポーネントも充実していて、imageやBanner、Button、Pagination、Textなど、ドラッグして配置することでモックアップを作成できます。 AIRアプリのUI。なかなかいい感じ。 ドラッグしたコンポーネントをダブルクリックすると、値や色を変更できたり、deleteキーで削除できたりと使いやすいですね。 ただ日本語が使用できないのが難点。アルファベットしか打てないようになっています。 一度見てみてください。 MockFlow 斉藤和義の武道館ライブ
代表中山陽平 ブログ「苦手意識を無くせばWeb活用はうまくいく」弊社では「がんばる中小企業」のWeb活用をサポートしています。今の時代、第3者である、制作会社や代理店におまかせでは勝てません。同じような商品・サービスが溢れる中、選んでもらうためのコンセプトを立て、それを実現するためにネットもリアルも総動員しながら戦う必要があります。 みなさんが世の中に・自社の従業員に実現したい幸せや提供価値を、しっかりと実現していくためには、みなさん自身が主役になり、私達のような専門会社が側面支援するのがベストです。 このブログでは御社が中心となってウェブ活用できるヒントを配信しています。お悩みの方はお気軽に問い合わせフォームからご相談ください。 最新の記事一覧
Mockingbird is no longer in operation. We’re hoping to open-source the code sometime in the near future. In the meantime, some simple alternatives, in a similar spirit to Mockingbird, are: Excalidraw: https://excalidraw.com TLDraw: https://www.tldraw.com If you need a more comprehensive mockup solution, you might want to check out the following: FigJam: https://www.figma.com/figjam/ MockFlow: http
最近見つけたWEBデザイン作成チュートリアル集のご紹介です。 ユニークなデザインから、クールなデザインまで、色々とあってデザインの際の参考にどうぞ。 Create a Clean and Colorful Web Layout in Photoshop | Grafpedia Design a colorful theme for wordpress | Grafpedia Photoshop Tutorials - HV-Designs.co.uk Create a nature inspired layout in photoshop | Grafpedia Photoshop tutorial to create an website layout inspired by apple.com | Grafpedia Learn how to design a car dealer w
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く