1.
班級:數媒3C 學號:A982014 姓名:周宜楹
互動網頁設計(一)-期末報告

2.
目录
CONTENTS
網頁發想
Web Page Thinking
網頁的內容有何不同
How is the content of the page
different
Icon 設計
Icon Design
發想資料來源
Thought Source
https://www.ypppt.com/

3.
01
網頁發想

4.
網頁發想
Web Page Thinking
網頁名稱: 宜的出遊及吃貨日誌
英文:YIYING'S TRAVEL AND FOODIE LOG
發想原因:
現在由於手機或是電視新聞都十分的普遍,彺彺都能從這些物品取得許多資訊,不管是住宿資
訊或是吃、喝、玩、樂…皆有,像是:小紅書或者們現在最常使用的ig跟抖音…等等,所以我才
忽然又想到在最早之前大人們流行的無名小站,有沒有機會再次流行回來,因為現在其實蠻多
東西又慢慢以不同的形式流行回來了
像: 拍貼機以前是只能畫一畫小東西,現在則是多了更多配件及飾品
而我的網站英文字及宜字都是取至於我自己的名字
出遊跟吃貨都是在說我自己因為我自己是一個愛分享跟出去玩還有尋找美食的人

5.
02
Icon 設計

6.
请替换文字内容
请替换文字内容，修改文字内容，
也可以直接复制你的内容到此。请
替换文字内容，修改文字内容，也
可以直接复制你的内容到此。
 请替换文字内容，修改文字内容，也可以直接复制你的内容到此。请
替换文字内容，修改文字内容，也可以直接复制你的内容到此。
 请替换文字内容，修改文字内容，也可以直接复制你的内容到此。请
替换文字内容，修改文字内容，也可以直接复制你的内容到此。
 请替换文字内容，修改文字内容，也可以直接制你的内容到此。请替
换文字内容，修改文字内容，也可以直接复制你的内容到此。
请替换文字内容，修改文字内容，也
可以直接复制你的内容到此。请替换
文字内容，修改文字内容，也可以直
接复制你的内容到此。请替换文字内
容，修改文字内容，也可以直接复制
你的内容到此。请替换文字内容，修
改文字内容，也可以直接复制你的内
容到此。请替换文字内容，修改文字
内容，也可以直接复制你的内容到此。
请替换文字内容，修改文字内容，也
可以直接复制你的内容到此。请替换
文字内容，修改文字内容，也可以直
接复制你的内容到此。请替换文字内
容，修改文字内容，也可以直接复制
你的内容到此。
Icon 設計
Icon Design
Icon 使用的軟體:
Adobe Illustrator 2022
Green Fish Icon Editor 3.31
AI 其實在平常就蠻常用的
,所以還算不會太卡
Green Fish : 真的就比較少
接觸了,但有去 YT 查找影
片看了幾次,算還蠻好上手
的
Icon 設計:
Before:
After:
最一開始Bootstrap 範例給的
這是之後我先在AI 設計完後再丟到Green
Fish裡微調,至於飛機跟筷子是因為出遠門
搭飛機感覺就很像要去一趟未知的旅行,筷
子就像是告訴美食我準備好要來吃你了

7.
03
網頁的內容有何不同

8.
網頁的內容有何不同
How is the content of the page different
大頭貼本來一開始傻傻地以為用AI能成
功的使用結果發現並不能,所以我就去查
找了很多資料,最後在YT有找到一部交的
比較詳細的講師
至於背景色,我是上網查了Bootstrap
color,每個顏色都有試,最後就決定偏柳
丁黃的這個顏色因為比較亮色系

9.
網頁的內容有何不同
How is the content of the page different
改了不同的小圖標,
皆從Fontawesome
找的

10.
網頁的內容有何不同
How is the content of the page different
我將它原本的圖片全部改成我自己
可能有出去玩或試拍到的美食都丟上去
而改掉的小圖標一樣是從Fontawesome找的

11.
網頁的內容有何不同
How is the content of the page different
本來照理說他跟第一張
要展開時應該是為同一張,我將它改
成兩張不一樣,比較有不同的驚喜感
跟說明的部分我有去找網路上他們
有的有品牌及餐廳本身的介紹
而按鈕的自我也有改
本來是Close window
我將它改成 Thanks For Read

12.
網頁的內容有何不同
How is the content of the page different
至於這我將它做了字上面的些許微調跟
本來它有個連結是連到Bootstrap
我將連結接連到我的ig原因是因為我找不到
Ig的圖示所以改用連結圖式

13.
網頁的內容有何不同
How is the content of the page different
最後面我將它改成回饋單
跟下面的圖式我都改成可以直接連到另一個網站
像:臉書、Line及Github…等等
我也有添加了每日一句,試著改變成不一樣的
部落格,較朝有點現代化,跟之前些許不一樣

14.
04
發想資料來源

15.
1 2 3
發想資料來源
Thought Source
分別為: 小紅書、抖音以及ig…等等,這些都是現在正紅的APP
裡面都有共同都有:像有的會發景點有的會發美食,不然就是穿搭及
彩妝的各個部份

16.
感 謝 您 的 觀 看