Webサイトをデザインする際、ページレイアウトや機能設計など、最初に作るWebサイトの骨組みのことを「ワイヤーフレーム」と呼ぶらしい。
CG上がりの自分は、ワイヤーフレームと言うと内挿補間していないポリゴンを連想してしまうのだが、この「Webサイトのワイヤーフレーム」は要するに「画面設計」みたいなものだろうか。
画面設計と呼ぶと途端にエクセル方眼紙みたいなイメージがわくけど、こっちはSEやプログラマー用語なんだろうか。
このワイヤーフレームを作るためのオンラインツールというものがいくつか存在するらしい。
iPlotz
Gliffy
mockingbird
参考：オンラインで使えるワイヤーフレーム作成ツール
ちょっと触ってみたけど、単純にレイアウトや色味などをデザインしたいなら、PhotoshopやIllustratorの方が良さそう。たぶんWebサイト設計で問題となるのは「機能」なんだろうな、と改めて思う。
デザインとは言っても、Webサイトの場合は完全にゼロから自由に始めることはほとんどなくて、使うインフラやライブラリはすでに検討をつけてあり、必然的に制約が担保される。
Webサイトのデザイン作業において、機能をアイコン表記するだけで成り立つのは、「全く新しい機能」なんてものはほとんど導入しないから。
また、業務システムの設計がエクセル方眼紙でそこそこ成り立つのも同じで「UIはいつものパターン」という共通認識が出来上がっているから。業務システムでまず注力するのはビジネスロジックであって、UIやUXではない。
UIデザインと機能デザインを同時平行して「全く新しいもの」なんてなかなか作れるもんじゃない。
と、昔の業務システム開発の経験を振り返ったのであった。(何が言いたかったんだ？)
関連記事
3Dグラフィックスの入門書
フィクションに登場するUIデザインのまとめサイト
OpenMVS：Multi-View Stereoによる3次...
サンプルコードにも間違いはある？
UnityでPoint Cloudを表示する方法
Konashiを買った
HTML5・WebGLベースのグラフィックスエンジン『Goo...
仮想関数
NeuralNetwork.NET：.NETで使えるTens...
Model View Controller
Twitter APIのPythonラッパー『python-...
Math.NET Numerics：Unityで使える数値計...
OpenCV
UnityのuGUIチュートリアル
UnityでTweenアニメーションを実装できる3種類の無料...
Google XML Sitemap Generatorプラ...
線画を遠近法で描く
Google App Engineのデプロイ失敗
オープンソースのIT資産・ライセンス管理システム『Snipe...
ブログが3日間ほどダウンしてました
OpenCVでカメラ画像から自己位置認識 (Visual O...
3分の動画でプログラミングを学習できるサイト『ドットインスト...
WordPress on Windows Azure
PyMC：Pythonのベイズ統計ライブラリ
LuxCoreRender：オープンソースの物理ベースレンダ...
Mayaのプラグイン開発
ZScript
Windows10でPyTorchをインストールしてVSCo...
OpenCV3.3.0でsfmモジュールのビルドに成功！
AmazonEC2のインスタンスをt1.microからt2....
天体写真の3D動画
Web経由でRaspberry PiのGPIOを操作したい
openMVG：複数視点画像から3次元形状を復元するライブラ...
プログラミングスキルとは何か？
Google Colaboratoryで遊ぶ準備
TensorSpace.js：ニューラルネットワークの構造を...
WordPressで数式を扱う
Mean Stack開発の最初の一歩
konashiのサンプルコードを動かしてみた
ブログがダウンしてました
マンガで分かる JavaScriptプログラミング講座
Pylearn2：ディープラーニングに対応したPythonの...
コメント