LogoMark.png

情報デザイン演習IIIA/2021/1019

第6回|パターンのデザイン

情報デザイン演習IIIA/2021 2021.10.19
学科サイト|受講生一覧

AGENDA


以下、LIVE動画をご覧下さい。記事に沿って解説します。
記録動画の公開は10月22日(金)までとします。早めの確認をお願いします。



CONTENTS




はじめに

今後の進行計画

次回、10月26日の中間報告について

付記:ダッシュボードにログインするには・・・

X-Freeの管理画面に入る必要はありません。以下のとおり、自分のWebサイトにアクセスできれば、そこからログインできます。

「投稿」と「固定ページ」(フローとストック)

「地域を紹介するサイト」では、観光スポット、グルメスポット、祭り、特産品、出身有名人・・といった個別投稿に適した情報と、地域の基本情報(面積・人口など)、交通アクセス、街歩きマップ、年間行事一覧など、固定ページに適した情報があります。まずは、その分類から考えましょう。

情報をフローとストックに分ける・・という発想が必要です。


投稿(Post|Flow)

メニュー上では「カテゴリーメニュー」として自動回収

固定ページ(Page|Stock)

メニュー上では「固定ページ」として常設表示

付記
旅行会社のサイトや、市町村のサイトで、どのように情報が整理されているか、先行事例を十分に調査することが必須の前提です。

参考:InformationDesign|情報の管理



投稿記事のパターンデザイン

投稿記事を構成する情報要素を洗い出して、記事のタイプ別(例えば、名所紹介、特産物紹介などごと)にワイヤーフレームを作成しましょう。

記事の構成

投稿記事がどのようなタイプのものであるかによって、理想的なページレイアウトは異なるものです。投稿は、一般に以下のような要素を含みます

項目事例:絵画作品の紹介

ワイヤーフレームを作成するツールについて

作成するツールは、Abobe Illustrator など使い慣れたもの、何でも構いません。最終的に画像として、学科サイトに掲載できればOKです。
Abobe Illustrator以外に、以下のようなツールもあります。




本日の演習

記事ページの構成を検討

例えば、名所紹介記事、人物紹介記事、特産品紹介記事など、それぞれのプロトタイプを作成して、「名所紹介記事プロトタイプ」等の名称で投稿し、それぞれのプロトタイプが閲覧・共有できるようにしてください。

ワイヤーフレームの作成

記事のタイプ別にページのレイアウトを検討して、ワイヤーフレームを図として作成してください。




学科サイトの更新

概要>ワイヤーフレーム部分

プロジェクト管理部分

進捗記録の部分

以下の形式を参考に、本日の作業報告を記載して下さい。

**2020.10.12
***記事タイプ別投稿プロトタイプ
-[[名所紹介記事のプロトタイプ>https://・・・・・]]
-[[人物紹介記事のプロトタイプ>https://・・・・・]]
~

***WordPress|技術メモ
(本日の演習で学んだ WordPress の基本操作についてメモを残しましょう)
~




参考:学科サイトにおける画像の列挙方法

ワイヤーフレーム画像を列挙する場合、以下を参考にして下さい。

インライン配置

&image(sample.jpg,,20%); &image(sample.jpg,,20%); &image(sample.jpg,,20%);

sample.jpg sample.jpg sample.jpg

画像をインライン要素(プラグイン記号 & )として表示することで、文字並びと同様に、羅列させて表示することができます。この場合、2番目のパラメータは空欄(カンマを連打 [ ,, ] )にして下さい。

表組

|49|2|49|c ← 合計が 100(%)になるように
|#image(sample.jpg)| |#image(sample.jpg)|
sample.jpg
sample.jpg

付記)表の罫線を消したい場合は、ページの先頭に以下を記入して下さい。

#settableborder(none)



PAGES

GUIDE

TOOL

DATA

Last-modified: 2021-10-19 (火) 16:00:10