Webサイトをデザインする際、ページレイアウトや機能設計など、最初に作るWebサイトの骨組みのことを「ワイヤーフレーム」と呼ぶらしい。
CG上がりの自分は、ワイヤーフレームと言うと内挿補間していないポリゴンを連想してしまうのだが、この「Webサイトのワイヤーフレーム」は要するに「画面設計」みたいなものだろうか。
画面設計と呼ぶと途端にエクセル方眼紙みたいなイメージがわくけど、こっちはSEやプログラマー用語なんだろうか。
このワイヤーフレームを作るためのオンラインツールというものがいくつか存在するらしい。
iPlotz
Gliffy
mockingbird
参考：オンラインで使えるワイヤーフレーム作成ツール
ちょっと触ってみたけど、単純にレイアウトや色味などをデザインしたいなら、PhotoshopやIllustratorの方が良さそう。たぶんWebサイト設計で問題となるのは「機能」なんだろうな、と改めて思う。
デザインとは言っても、Webサイトの場合は完全にゼロから自由に始めることはほとんどなくて、使うインフラやライブラリはすでに検討をつけてあり、必然的に制約が担保される。
Webサイトのデザイン作業において、機能をアイコン表記するだけで成り立つのは、「全く新しい機能」なんてものはほとんど導入しないから。
また、業務システムの設計がエクセル方眼紙でそこそこ成り立つのも同じで「UIはいつものパターン」という共通認識が出来上がっているから。業務システムでまず注力するのはビジネスロジックであって、UIやUXではない。
UIデザインと機能デザインを同時平行して「全く新しいもの」なんてなかなか作れるもんじゃない。
と、昔の業務システム開発の経験を振り返ったのであった。(何が言いたかったんだ？)
関連記事
プロダクトデザイン概論
SDカードサイズのコンピューター『Intel Edison』
Mitsuba 3：オープンソースの研究向けレンダラ
Gource：バージョン管理の履歴を可視化するツール
Unity ARKitプラグインサンプルのドキュメントを読む
WordPressをAmazon EC2のt2microイン...
Mitsuba 2：オープンソースの物理ベースレンダラ
Windows10でPyTorchをインストールしてVSCo...
PythonでMayaのShapeノードプラグインを作る
Raspberry PiでIoTごっこ
WordPressのサーバ引っ越し方法を考える
Seleniumを使ったFXや株の自動取引
BlenderProc：Blenderで機械学習用の画像デー...
網元AMIで作ったWordpressサイトのインスタンスをt...
ROMOハッカソンに行ってきた
UnityでShaderの入力パラメータとして行列を渡す
Unityの薄い本
科学技術計算向けスクリプト言語『Julia』
UnityプロジェクトをGitHubで管理する
adskShaderSDK
UnityでLight Shaftを表現する
布のモデリング
手を動かしながら学ぶデータマイニング
VCG Library：C++のポリゴン操作ライブラリ
Math Inspector：科学計算向けビジュアルプログラ...
openMVG：複数視点画像から3次元形状を復元するライブラ...
Unreal Engineの薄い本
Google XML Sitemap Generatorプラ...
OpenCV 3.3.0 contribのsfmモジュールの...
TensorFlowでCGを微分できる『TensorFlow...
Mean Stack開発の最初の一歩
GitHub Pagesで静的サイトを作る
WordPressで数式を扱う
Unity Scriptコーディング→Unreal Engi...
UnityのTransformクラスについて調べてみた
ZScript
Mechanizeで要認証Webサイトをスクレイピング
Composition Rendering：Blenderに...
OANDAのfxTrade API
デザインのリファイン再び
OpenSfM：PythonのStructure from ...
オープンソースのIT資産・ライセンス管理システム『Snipe...
コメント