Webサイトのワイヤーフレームが作成できるオンラインツール

Webサイトをデザインする際、ページレイアウトや機能設計など、最初に作るWebサイトの骨組みのことを「ワイヤーフレーム」と呼ぶらしい。
CG上がりの自分は、ワイヤーフレームと言うと内挿補間していないポリゴンを連想してしまうのだが、この「Webサイトのワイヤーフレーム」は要するに「画面設計」みたいなものだろうか。
画面設計と呼ぶと途端にエクセル方眼紙みたいなイメージがわくけど、こっちはSEやプログラマー用語なんだろうか。

このワイヤーフレームを作るためのオンラインツールというものがいくつか存在するらしい。
iPlotz
Gliffy
mockingbird
参考:オンラインで使えるワイヤーフレーム作成ツール


スポンサーリンク

ちょっと触ってみたけど、単純にレイアウトや色味などをデザインしたいなら、PhotoshopやIllustratorの方が良さそう。たぶんWebサイト設計で問題となるのは「機能」なんだろうな、と改めて思う。
デザインとは言っても、Webサイトの場合は完全にゼロから自由に始めることはほとんどなくて、使うインフラやライブラリはすでに検討をつけてあり、必然的に制約が担保される。
Webサイトのデザイン作業において、機能をアイコン表記するだけで成り立つのは、「全く新しい機能」なんてものはほとんど導入しないから。
また、業務システムの設計がエクセル方眼紙でそこそこ成り立つのも同じで「UIはいつものパターン」という共通認識が出来上がっているから。業務システムでまず注力するのはビジネスロジックであって、UIやUXではない。
UIデザインと機能デザインを同時平行して「全く新しいもの」なんてなかなか作れるもんじゃない。
と、昔の業務システム開発の経験を振り返ったのであった。(何が言いたかったんだ?)


スポンサーリンク

関連記事

OpenCVベースの背景差分ライブラリ『BGSLibrary』
日本でMakersは普及するだろうか?
『Geocities-izer』 どんなWebページも一昔前のダサいデザインに変えてくれるサービス
Web経由でRaspberry PiのGPIOを操作したい
続・ディープラーニングの資料
OpenCVで顔のランドマークを検出する『Facemark API』
ニューラルネットワークの構造を可視化するフレームワーク『TensorSpace.js』
変形ロボットのデザイン
機械学習で遊ぶ
Seleniumを使ったFXや株の自動取引
DCGAN (Deep Convolutional GAN):畳み込みニューラルネットワークによる敵...
openMVGをWindows10 Visual Studio 2015環境でビルドする
機械学習手法『SVM(Support Vector Machine)』
Unity ARKitプラグインサンプルのドキュメントを読む
OpenCVの超解像処理モジュール『Super Resolution』
OpenCV 3.1とopencv_contribモジュールをVisual Studio 2015で...
ディープラーニング
2D→3D復元技術で使われる用語まとめ
タマムシっぽい質感
C++の抽象クラス
Unityで使える数値計算ライブラリ『Math.NET Numerics』
AfterEffectsプラグイン開発
PythonのHTML・XMLパーサー『BeautifulSoup』
IronPythonを使ってUnity上でPythonのコードを実行する
iOSデバイスのためのフィジカル・コンピューティングツールキット『konashi(こなし)』
html5のcanvasの可能性
オープンソースの人体モデリングツール『MakeHuman』のAPI開発プロジェクトがスタート
ネームサーバとDNSレコードの話
iOSで使えるJetpac社の物体認識SDK『DeepBelief』
Amazon Web ServicesでWordPress
pythonもかじってみようかと
バージョン管理の履歴を可視化するツール『Gource』
ディープラーニングに対応したPythonの機械学習ライブラリ『Pylearn2』
iPhone・iPod touchで動作する知育ロボット『ROMO』
C#で使える遺伝的アルゴリズムライブラリ『GeneticSharp』
ドットインストールのWordPress入門レッスン
読みやすくて高速なディープラーニングのフレームワーク『Caffe』
JavaScriptとかWebGLとかCanvasとか
『手を動かしながら学ぶエンジニアのためのデータサイエンス』ハンズオンセミナーに行ってきた
Webスクレイピングの勉強会に行ってきた
オープンソースのロボットアプリケーションフレームワーク『ROS (Robot Operating S...
Faster R-CNN:ディープラーニングによる一般物体検出手法

コメント