---
# System prepended metadata

title: 團體專題(F組)
tags: [跨裝置企業平台與資料庫整合設計班]

---

團體專題(F組)
===

:::info
[本文分享短網址](https://bit.ly/2V5fgPw)
:::

:::success
[DEMO網址](https://edwiin1688.github.io)
[DEMO短網址](https://bit.ly/3gd9CmE)
:::

[QR Code 條碼產生器](http://qr.calm9.com/tw/)
[QR碼產生器](https://qr.ioi.tw/zh/)
可以放 logo

:::info
![team-work-QR-code](https://i.imgur.com/rJ4Tqko.png　=100x)

![team-work-QR-code](https://i.imgur.com/EwnRH1z.png =100x)

![team-work-QR-code](https://i.imgur.com/tgYa2IA.png =100x)
:::


---

[Trello-F組](https://trello.com/b/Co2OCoul/f%E7%B5%84)

[網站地圖](https://docs.google.com/document/d/1Eutzs6iS03rdJRFRJeQgeU5uEGoaDGwCPf0mEVQ4yvg/edit)

[Pinterest-專題參考](https://www.pinterest.com/peko06190723pc/%E5%B0%88%E9%A1%8C%E5%8F%83%E8%80%83/?invite_code=6ea58d32ac3744e89d9ff6ba8878b642&board_collab_inviter=True&inviter_user_id=820147919549206173)

[參考網站 - 飛鳥恰恰 Glamping](https://iglamping.tw/2020-flybird-glamping-%e8%b1%aa%e8%8f%af%e9%9c%b2%e7%87%9f/)

[專題參考網站](https://docs.google.com/spreadsheets/d/1w9mmx7fYBetSNZdsXkDJpExyg9d7Q5fgPDItowYZyj8/edit#gid=0)

[Wireframe設計稿](https://drive.google.com/drive/folders/1MZ1rSOPFtblcaAVkrH2CeBLKI79DUMbY)

[html 網頁效果](https://hackmd.io/0H1Q3BhGRZipuS93-f0wYg?view)

[希望的輪撥效果](https://housesof.world/)
![](https://i.imgur.com/IMdSTXs.jpg)
[老師建議參考的網站](https://aeon-fitness.com/product/PROFESSIONAL/TREADMILL/A10T)
![](https://i.imgur.com/ZH9FKMm.png)


[瀑布流](https://japapo.co.jp/)
![](https://i.imgur.com/O7n2QCd.jpg)



---

## 參考網站
網站連結：[ISHIGAKI NOW](http://usioproject.com/ishigakinow/zhhant/)
![](https://i.imgur.com/Df6fTkm.png =500x)
先出現簡單線條與文字動畫
![](https://i.imgur.com/58tekJy.jpg =500x)
背景影片才出現
![](https://i.imgur.com/ihjNIQM.jpg =500x)
背景影片本身也有輪撥功能

:::info
這樣的安排 
可以解決影片下載
載入過慢的問題
:::

[RWD網頁設計範例 -打造您的完美品牌形象網站｜愷偲品牌設計 - COSMO愷偲品牌企劃設計](https://www.cosmo-br.com/works_type.php?typeid=3&gclid=EAIaIQobChMI8O7OhYyZ6gIVBldgCh0mlA3YEAAYAyAAEgJOuPD_BwE)
![](https://i.imgur.com/lDmg7nA.png =500x)
NavBar 點擊後有動畫演出
![](https://i.imgur.com/ln0Jb4f.png =500x)

[運用 clip-path 的純 CSS 形狀變換](https://www.oxxostudio.tw/articles/201503/css-clip-path.html)

## 轉檔
[PNG轉WEBP - 在線轉換圖像文件](https://www.aconvert.com/tw/image/png-to-webp/)
[pingo 免費 Windows 圖片最佳化工具，支援 JPG、PNG 等格式無損壓縮](https://free.com.tw/pingo/)
[Pingo 圖片無損壓縮，批量壓縮 PNG / JPG 速度最快壓縮工具](https://zi.media/@ez3c/post/2tgFjC)

## 專案資料

[專題資料夾](https://drive.google.com/drive/folders/1REs6a9QNblMCezlJYwrU12hKmbNKkKzA)

[專題參考網站](https://docs.google.com/spreadsheets/d/1w9mmx7fYBetSNZdsXkDJpExyg9d7Q5fgPDItowYZyj8/edit?usp=sharing)

## Demo
[室內設計 Demo](https://edwiin1688.github.io/Interior-design)

## 參考資料
[IKEA 居家規劃軟體](https://kitchenplanner.ikea.com/tw/UI/Pages/VPUI.htm?Lang=zh-TW)

###### tags: `跨裝置企業平台與資料庫整合設計班`