Webサイトをデザインする際、ページレイアウトや機能設計など、最初に作るWebサイトの骨組みのことを「ワイヤーフレーム」と呼ぶらしい。
CG上がりの自分は、ワイヤーフレームと言うと内挿補間していないポリゴンを連想してしまうのだが、この「Webサイトのワイヤーフレーム」は要するに「画面設計」みたいなものだろうか。
画面設計と呼ぶと途端にエクセル方眼紙みたいなイメージがわくけど、こっちはSEやプログラマー用語なんだろうか。
このワイヤーフレームを作るためのオンラインツールというものがいくつか存在するらしい。
iPlotz
Gliffy
mockingbird
参考：オンラインで使えるワイヤーフレーム作成ツール
ちょっと触ってみたけど、単純にレイアウトや色味などをデザインしたいなら、PhotoshopやIllustratorの方が良さそう。たぶんWebサイト設計で問題となるのは「機能」なんだろうな、と改めて思う。
デザインとは言っても、Webサイトの場合は完全にゼロから自由に始めることはほとんどなくて、使うインフラやライブラリはすでに検討をつけてあり、必然的に制約が担保される。
Webサイトのデザイン作業において、機能をアイコン表記するだけで成り立つのは、「全く新しい機能」なんてものはほとんど導入しないから。
また、業務システムの設計がエクセル方眼紙でそこそこ成り立つのも同じで「UIはいつものパターン」という共通認識が出来上がっているから。業務システムでまず注力するのはビジネスロジックであって、UIやUXではない。
UIデザインと機能デザインを同時平行して「全く新しいもの」なんてなかなか作れるもんじゃない。
と、昔の業務システム開発の経験を振り返ったのであった。(何が言いたかったんだ？)
関連記事
UnityプロジェクトをGitHubで管理する
マルコフ連鎖モンテカルロ法
Javaで作られたオープンソースの3DCGレンダラ『Sunf...
HD画質の無駄遣い
組み込み向けのWindows OS 『Windows Emb...
Raspberry Pi 2のGPIOピン配置
Unityからkonashiをコントロールする
映画から想像するVR・AR時代のGUIデザイン
Google App Engineのデプロイ失敗
ブログの復旧が難航してた話
ArUco：OpenCVベースのコンパクトなARライブラリ
Webページ制作のためのメモ
DCGAN (Deep Convolutional GAN)...
プロダクトデザイン概論
GAN (Generative Adversarial Ne...
OpenGV：画像からカメラの3次元位置・姿勢を推定するライ...
Pythonの自然言語処理ライブラリ『NLTK(Natura...
libigl：軽量なジオメトリ処理ライブラリ
PythonでBlenderのAdd-on開発
Pythonのソースコードに特化した検索エンジン『Nulle...
株式会社ヘキサドライブの研究室ページ
変形ロボットのデザイン
アクセス元IPアドレスから企業名が分かるアクセス解析『Use...
iPhone・iPod touchで動作する知育ロボット『R...
Multi-View Environment：複数画像から3...
今年もSSII
TorchStudio：PyTorchのための統合開発環境と...
TensorFlowでCGを微分できる『TensorFlow...
動的なメモリの扱い
Raspberry PiのGPIOを操作するPythonライ...
ZBrushのZScript入門
デザインのリファイン再び
Iridescence：プロトタイピング向け軽量3D可視化ラ...
HTML5・WebGLベースのグラフィックスエンジン『Goo...
Pylearn2：ディープラーニングに対応したPythonの...
Twitter APIのPythonラッパー『python-...
C++ 標準テンプレートライブラリ (STL)
Caffe：読みやすくて高速なディープラーニングのフレームワ...
KelpNet：C#で使える可読性重視のディープラーニングラ...
オープンソースの物理ベースGIレンダラ『appleseed』
Unityの各コンポーネント間でのやり取り
OpenCV
コメント