Webサイトをデザインする際、ページレイアウトや機能設計など、最初に作るWebサイトの骨組みのことを「ワイヤーフレーム」と呼ぶらしい。
CG上がりの自分は、ワイヤーフレームと言うと内挿補間していないポリゴンを連想してしまうのだが、この「Webサイトのワイヤーフレーム」は要するに「画面設計」みたいなものだろうか。
画面設計と呼ぶと途端にエクセル方眼紙みたいなイメージがわくけど、こっちはSEやプログラマー用語なんだろうか。
このワイヤーフレームを作るためのオンラインツールというものがいくつか存在するらしい。
iPlotz
Gliffy
mockingbird
参考：オンラインで使えるワイヤーフレーム作成ツール
ちょっと触ってみたけど、単純にレイアウトや色味などをデザインしたいなら、PhotoshopやIllustratorの方が良さそう。たぶんWebサイト設計で問題となるのは「機能」なんだろうな、と改めて思う。
デザインとは言っても、Webサイトの場合は完全にゼロから自由に始めることはほとんどなくて、使うインフラやライブラリはすでに検討をつけてあり、必然的に制約が担保される。
Webサイトのデザイン作業において、機能をアイコン表記するだけで成り立つのは、「全く新しい機能」なんてものはほとんど導入しないから。
また、業務システムの設計がエクセル方眼紙でそこそこ成り立つのも同じで「UIはいつものパターン」という共通認識が出来上がっているから。業務システムでまず注力するのはビジネスロジックであって、UIやUXではない。
UIデザインと機能デザインを同時平行して「全く新しいもの」なんてなかなか作れるもんじゃない。
と、昔の業務システム開発の経験を振り返ったのであった。(何が言いたかったんだ？)
関連記事
Seleniumを使ったFXや株の自動取引
TeleSculptor：空撮動画からPhotogramme...
UnityのTransformクラスについて調べてみた
ドラマ『ファーストクラス』のモーショングラフィックス
『日本の巨大ロボット群像』を見てきた
OpenAR：OpenCVベースのマーカーARライブラリ
書籍『ROSプログラミング』
胡散臭いデザインの参考サイト
Mayaのプラグイン開発
オープンソースの物理ベースGIレンダラ『appleseed』
TorchStudio：PyTorchのための統合開発環境と...
Google XML Sitemap Generatorプラ...
Pylearn2：ディープラーニングに対応したPythonの...
C#で使える遺伝的アルゴリズムライブラリ『GeneticSh...
AMIMOTO HHVMのパッケージを3.9へ更新
ブログのデザイン変えました
WordPressプラグインの作り方
BlenderProc：Blenderで機械学習用の画像デー...
科学技術計算向けスクリプト言語『Julia』
ブログの復旧が難航してた話
ブログがダウンしてました
ROSの薄い本
Point Cloud Utils：Pythonで3D点群・...
天体写真の3D動画
ブログをGoogle App EngineからAmazon ...
UnityでShaderの入力パラメータとして行列を渡す
Unityで画面タッチ・ジェスチャ入力を扱う無料Asset『...
OpenCV
openMVGをWindows10 Visual Studi...
ブログをAWSからwpXへ移行
オープンソースの顔の動作解析ツールキット『OpenFace』
OpenCVでPhotoshopのプラグイン開発
ヒトデの骨格のような構造物を作成するシステム『KINEMAT...
Webスクレイピングの勉強会に行ってきた
任意の英語サイト中で自分がまだ覚えていない英単語だけに日本語...
マンガで分かる JavaScriptプログラミング講座
スクラッチで既存のキャラクターを立体化したい
Kubric：機械学習用アノテーション付き動画生成パイプライ...
続・ディープラーニングの資料
PyTorch3D：3Dコンピュータービジョンライブラリ
UnityのuGUIチュートリアル
OpenMVSのサンプルを動かしてみる
コメント