A website proposal for IPass

1. Thinking of
Web Design
- Transport Project

2. Case Profile
發案⽅方 ⼩小額付費智慧卡營運商
內容 網站及App規劃
網站 提供營運商服務資訊
智慧卡消費記錄查詢
智慧卡掛失
相關商業活動資訊
⾏行動裝置 個⼈人智慧卡管理
個⼈人帳務管理
合作營業點地理資訊查詢
優惠活動廣告
註：本提案最終並未獲得採⽤用，以下以此提案的規劃過程當作案例⽰示範⽤用

3. Requirements
系統需求

6. Analysis
分析

7. Ux Design
設計

8. Front Page

12. Citizen Page

17. Article Page

19. Proposal

20. I Pass
Nearby Services
Mulberry Restaurant
No. 77,Wufu 1st Rd. LingYa Dist. 07-229-5377
1.5km 120
120m Wufu High School
77, 28, R6, R12
1.7km Howard Hotel
Chi Zhang Rd.
20m Mulberry Bistro
Water Flow Design
可以逛的界⾯面設計...

21. Pinterest每分鐘的活躍
⽤用⼾戶平均可達到1.1萬⼈人
該站導引到其他電⼦子商
務網站的轉換率⾼高達
41%，遠⽐比Facebook的
37%還來得⾼高
每⼀一筆訂單的平均消費
⾦金額為179.36美元，⽐比
Twitter所帶進的68.78
美元和Facebook的
80.22美元都來得⾼高

22. I Pass
Nearby Services
Mulberry Restaurant
No. 77,Wufu 1st Rd. LingYa Dist. 07-229-5377
1.5km 120
120m Wufu High School
77, 28, R6, R12
1.7km Howard Hotel
Chi Zhang Rd.
20m Mulberry Bistro
Beautiful CardView
吸引消費的體驗設計...

23. I Pass
Nearby Services
Mulberry Restaurant
No. 77,Wufu 1st Rd. LingYa Dist. 07-229-5377
1.5km 120
120m Wufu High School
77, 28, R6, R12
1.7km Howard Hotel
Chi Zhang Rd.
20m Mulberry Bistro
Focus on Personal Needs
作為留在⾸首⾴頁的App...
Johnson Wang
使⽤用記錄
交通
超商與量販
連鎖商店
停⾞車場
餐廳
住宿
娛樂
政府規費
其他

24. 加⼊入會員
粉絲團
卡⽚片介紹
地圖
服務條款
服務說明
taurant
LingYa Dist. 07-229-5377
1.5km 120
m Wufu High School
, R6, R12
km Howard Hotel
hang Rd.
m Mulberry Bistro
Focus on Personal Needs
作為留在⾸首⾴頁的App...

25. Mulberry Restaurant
No. 77,Wufu 1st Rd. LingYa Dist. 07-229-5377
1.5km 120
120m Wufu High School
77, 28, R6, R12
1.7km Howard Hotel
Break In Advertising
⾃自然⽽而然的切⼊入式廣告...
30%OFF
NOW ON
SALE!
LADY SHOP （漢神店）
1201.5km

26. 30%OFF
NOW ON
SALE!
LADY SHOP （漢神店）
1201.5km
120m Wufu High School
77, 28, R6, R12
1.7km Howard Hotel
Chi Zhang Rd.
20m Mulberry Bistro
Chi Zhang Rd.
1.2km Parking Lots
Chi Zhang Rd.
Block Sample
7-11 ⻘青雅⾨門市
(07) 253-3239 12km
Mulberry Restaurant
No. 77,Wufu 1st Rd. LingYa Dist. 07-229-5377
1.5km 120

27. Notifications
Mulberry 就在附近喔！有空來坐坐！I Pass
I Pass
Nearby Services
12km
Mulberry 就在附近喔！有空
來坐坐！
Push Notification
Inline Notification

28. Building The Ecosystem
創建⽣生態系

29. 可⾏行的廣告形態
• 常駐廣告機制
不分使⽤用者所在地點，⼀一率出現在登⼊入畫⾯面上⽅方，及下⽅方列表等兩處。
• 鄰近廣告機制
根據使⽤用者所在地點，越靠近的越優先顯⽰示的機制。
• 全⾯面推播廣告機制
所有⼈人皆會收到
• 分眾推播廣告機制
靠近特定地點時會收到

30. system boundary
營運⼈人員
廣告主
廣告代理商
信息公告
資料維護
與上稿
廣告管理與審核
會員管理
品牌資料管理
廣告投遞管理
代理廣告主操作
持卡⽤用⼾戶
檢視優惠
訊息
各類資料
統計及報表
個⼈人記帳管理
交易記錄查詢
卡⽚片儲值
狀況查詢

31. 廣告管理架構
App管理平台
內部管理 廣告主服務
Application Server
IOS App Android Apk WM8
RESTFul API + Ajax

32. 廣告管理架構
ASPX
內部管理平台
API Controllers
HTML5 + Ajax
RESTFul API + JSON
官網
Database
⼀一卡通API
官網
Database

33. ⾴頁⾯面廣告
新聞 活動
公告 ⽂文章
優惠訊息

34. 廣告管理架構
內部管理
靜態資料上稿 會員管理
營業點資訊維護
廣告分區設定
廣告參數設定
營運報表
廣告投放審核機制
靜態廣告檔期管理
代理商管理
廣告主管理

35. 廣告管理架構
廣告主服務
品牌資料上稿
廣告效益報告
會員匿名統計報告
廣告投放管理
客服專區
線上註冊服務

36. 廣告投放流程
代理操作服務
廣告主⾃自⾏行操作

37. 廣告投放流程
廣告主⾃自⾏行操作 註冊廣告主帳號
並上傳相關⽂文件
資格審核
廣告主
資料設定
廣告檔次
設定期程
廣告內⽂文
審查放⾏行
進⼊入廣告
投放排程
設定公司資訊，品牌形象圖，
Logo簡介及地址等。
必要時需設定營各運點地址。
線上註冊審核可減輕內部管理
壓⼒力，把⽂文件整理交給系統來
完成。
為避免不當利⽤用，所有廣告投
放皆須經過審核。
指定廣告圖，⽂文案，有效範圍
及時間，以及投放額度上限。
（須先線上購買廣告點數）
列表審核，
以避免不當內⽂文出現。
進⼊入等候露出之排程機制。
30%OFF
NOW ON
SALE!
LADY SHOP （漢神店）
1201.5km
廣告範例

38. 廣告投放流程
代理操作服務 註冊廣告主帳號
並上傳相關⽂文件
資格審核
廣告主
資料設定
廣告檔次
設定期程
廣告內⽂文
審查放⾏行
進⼊入廣告
投放排程
流程與廣告主⾃自⾏行投放相同，
唯廣告收益將根據各代理商所
談之拆成⽐比，於實際點擊發⽣生
後，次⽉月統計退回佣⾦金。
代理商登⼊入

39. Q&A