台灣有什麼能用的APP支援Wallet票卡? - iOS

Zenobia avatar
By Zenobia
at 2017-03-31T11:28

Table of Contents


昨天在這串的原文推文貼了我自製的Wallet,

今天睡醒發現大家好像對客製化Wallet滿有興趣的,

因為可能不太有時間寫教學文,簡單講一下我是怎麼做的。

-

其實有很多客製化Wallet的第三方服務,

基本上這些服務都是直接調用Apple Wallet的API

並且提供一個UI來讓使用者自訂票卡的各種屬性,

再通過網站生成的QR CODE來佈署到手機裡。


我是使用網頁版Passdock製作,他們提供的客製化選項很多,

而且可以增加地理資訊跟iBeacon資訊到票卡裡,

例如我把住家附近的全聯都加進地理資訊,當我GPS定位到這些地點的時候,

手機就會自動推送相對應的票卡給你使用。

網路上Passdock的教學文很多,大家可以去Google一下,

在設定條碼的部分只要參照實體卡片背面條碼底下的那一串數字來設定就好,
(那串數字就是條碼裡面包含的資訊 通常都只是卡號)

格式記得選實體卡條碼相應的格式,例如最常見的麵條形條碼就是CODE 128。

-

票卡設計的部分,

Passdock在製作票卡時都會提供上傳圖檔的地方,也都有尺寸標示,

我是搭配illustrator來製作我想要的圖檔。

票卡顏色就用滴管工具去吸各品牌的標準色來搭配XD

資料欄位就隨個人喜好打上去就好了(卡號 姓名什麼的)

-

最後講一個小技巧,Apple Wallet裡面的每張卡都有一個Certificate。

可以把Certificate想成是商家的簽署,來自同一個Certificate的卡片,

會全部堆疊在一起(因為系統看起來就是來自同一個商家),

就像Stocard做出來的那樣,你要先點進去那個卡堆中,

裡面的卡片才會橫向展開讓你左右滑動選取,而不是一張一張有秩序的站好。

所以說,如果我有五張卡片想讓他排排站好一目瞭然,

那我就需要五個Certificate,那Certificate要怎麼取得呢?

就是花100美金去買蘋果開發者帳號使用SDK去生成...

為了這幾張無關痛癢的卡片花100美金我想一般人都無法接受吧XD

重點來了,Passdock提供多達十組的Public Certificate,

這也是我會使用Passdock來製作的原因。


在用Passdock製作票卡的時候,按下網頁右上方的Advance

切換到進階模式,會有一欄是讓你設定Certificate,共有十組可以用。

所以最後出來的成果就會是每張卡片都有隔開不會堆疊。

大概就是這樣囉...


啊...不知不覺就寫了這麼多XD



P.S.不是每個商家都認數位形式的卡片,有些也是要帶實體卡,

有板友提到全聯只認實體卡,因為我最近都沒去消費,所以也沒拿給店員刷看看。

不過以往我去全聯買東西都只報電話而已...哈

補個圖

http://imgur.com/a/BYktW
http://imgur.com/a/ibmeK

--
Tags: iOS

All Comments

Jessica avatar
By Jessica
at 2017-04-05T05:54
Edith avatar
By Edith
at 2017-04-10T03:08
Xanthe avatar
By Xanthe
at 2017-04-15T01:37
Andrew avatar
By Andrew
at 2017-04-19T13:05
推Certificate說明
Lily avatar
By Lily
at 2017-04-20T06:33
Jessica avatar
By Jessica
at 2017-04-21T14:23
Hardy avatar
By Hardy
at 2017-04-23T17:10
太強大了!!!
Skylar Davis avatar
By Skylar Davis
at 2017-04-26T07:50
Genevieve avatar
By Genevieve
at 2017-04-29T12:45
全聯會員卡是用感應式的所以只認實體卡
Bennie avatar
By Bennie
at 2017-04-30T11:53
長姿勢 謝謝
Irma avatar
By Irma
at 2017-05-04T20:03
全聯不是都報電話嗎?
Kumar avatar
By Kumar
at 2017-05-06T01:45
可是有的卡是Code 32,Code 128不能用吧?
Catherine avatar
By Catherine
at 2017-05-11T01:26
我記得passdock只能選擇code 128,不知道能不能用圖檔?
Erin avatar
By Erin
at 2017-05-14T11:22
推認證說明
Ophelia avatar
By Ophelia
at 2017-05-15T18:50
推 但還是好難製作
Megan avatar
By Megan
at 2017-05-17T10:49
推!太用心了~
Carolina Franco avatar
By Carolina Franco
at 2017-05-21T13:17
我想問的是為什麼票卡左上角有些圖可以顯示很大有的很小??
Elizabeth avatar
By Elizabeth
at 2017-05-24T17:58
可以用圖檔,就是另外做Code39的圖當主圖去放就可以
Carolina Franco avatar
By Carolina Franco
at 2017-05-28T01:51
全聯有些優惠跟扣現金要用實體卡
Caitlin avatar
By Caitlin
at 2017-06-01T02:29
所以最多只有十張卡能立排,再多就只能用橫排囉?
Valerie avatar
By Valerie
at 2017-06-02T01:29
c大應該是在說這個,因為我的左上角的圖也是很小
Linda avatar
By Linda
at 2017-06-04T13:04
推!
James avatar
By James
at 2017-06-09T08:47
http://i.imgur.com/fYl3FKP.jpg
Thomas avatar
By Thomas
at 2017-06-11T02:46
http://imgur.com/eYLoroD 感謝F大的啓發,終於做好我的
Brianna avatar
By Brianna
at 2017-06-15T12:07
了! 雖然costco那張是做開心的XD(應該不能用
Tristan Cohan avatar
By Tristan Cohan
at 2017-06-18T02:05
推一個,昨天也是發現passdock的advance可以自定好多玩意
除了條碼以外的資訊可以自己惡搞很好玩XDDD
Ingrid avatar
By Ingrid
at 2017-06-18T03:37
我看了一下卡片的條碼基本上是用CODE128,不要亂改比較好
Emma avatar
By Emma
at 2017-06-19T09:54
另外我發現GPS雖然有十個可以用,但修改後在進去編輯
Michael avatar
By Michael
at 2017-06-22T08:23
第六個以後的GPS資訊回不見,不知道是不是網站的問題
David avatar
By David
at 2017-06-24T03:44
david大做的也很漂亮!
Jacob avatar
By Jacob
at 2017-06-28T08:37
看來D大要分享教學文了...
Damian avatar
By Damian
at 2017-06-29T21:03
推分享~但字卡顏色好難調@@
Andrew avatar
By Andrew
at 2017-07-02T15:02
http://i.imgur.com/bTLawC7.jpg 感謝分享心得,原先卡關在
把卡片分開,原來要改憑證
Christine avatar
By Christine
at 2017-07-04T03:10
提供教學與配色 https://goo.gl/0NIGFc
Zanna avatar
By Zanna
at 2017-07-09T02:42
passdock的比較好,條碼在相對比較上方
Bennie avatar
By Bennie
at 2017-07-12T15:28
但也比較難設計,英文苦手QQ
Cara avatar
By Cara
at 2017-07-16T04:06
做好是做好了,但要怎麼把卡片分開放呀 憑證要怎麼改
?@@
Blanche avatar
By Blanche
at 2017-07-20T07:38
http://i.imgur.com/SrUqwnf.jpg
Daph Bay avatar
By Daph Bay
at 2017-07-24T20:08
成功把卡放進去
http://i.imgur.com/ffsGbaO.jpg
Lauren avatar
By Lauren
at 2017-07-28T19:45
我自己打卡號上去的都不成功耶@@
Damian avatar
By Damian
at 2017-08-01T00:58
跟大家分享一下 我用ColorHelper 這個app 幫忙看色碼 不過
這個app介面還蠻簡陋的就是了
Yuri avatar
By Yuri
at 2017-08-05T04:50
我也成功了!感謝教學與幫助!
Todd Johnson avatar
By Todd Johnson
at 2017-08-09T09:23
http://i.imgur.com/Qu55JCB.jpg
Tom avatar
By Tom
at 2017-08-10T21:28
不知道F大方不方便分享素材 有些自己找的感覺沒F大的好
David avatar
By David
at 2017-08-14T13:20
大潤發會員號碼太長...超過了...XDD
Odelette avatar
By Odelette
at 2017-08-19T04:53
改憑證一直出現錯誤,卡關QQ
Delia avatar
By Delia
at 2017-08-22T15:05
想請問logo放上去的狀況 已經調過與logo背景相同顏色 可
是最上面會有漸層效果 不知道是否可以避免><
Jacky avatar
By Jacky
at 2017-08-27T10:59
原po的設計跟推文中的卡片都用得很漂亮耶,還以為是店家
推出的公版
Megan avatar
By Megan
at 2017-08-27T15:23
終於也做好自己的了http://imgur.com/XwiqFUv
Leila avatar
By Leila
at 2017-08-30T07:51
大家好厲害!請問屈臣式的logo 怎麼找,因為找到都有
白底!
Olga avatar
By Olga
at 2017-09-03T09:00
找png檔 或是自己用修圖軟體把白底透明化
Edwina avatar
By Edwina
at 2017-09-04T22:25
謝謝原po 我學會了 http://i.imgur.com/9ivuHA3.jpg
Kelly avatar
By Kelly
at 2017-09-07T19:18
請問做好後,掃QRcode一直出現"沒有此條碼可用之票卡"
Valerie avatar
By Valerie
at 2017-09-10T17:27
這要怎麼處理呢??手機是5S、iOS10.3.1
Valerie avatar
By Valerie
at 2017-09-15T06:15
http://i.imgur.com/uQIP7et.jpg
謝謝教學看這篇才知道有進階模式
Edwina avatar
By Edwina
at 2017-09-19T04:15
想詢問一下,我是使用passdock製作,怎麼把會員條碼放
到下方?還是只能把會員卡條碼製作成圖檔放在strip?
Quintina avatar
By Quintina
at 2017-09-19T12:19
有一個選項是條碼格式 如果是code-128可以填數字 passdo
ck會生出條碼

apple pay 信用卡名稱?

Oliver avatar
By Oliver
at 2017-03-31T11:18
apple pay 需要輸入信用卡名稱 請問要輸入什麼啊? 銀行名稱嗎? 如:台新 還是信用卡名稱? 如:數位生活卡 謝謝 ---------------------------------------------------------------------- ...

兩支iphone 不同SIM 卡, 會同時響

Skylar DavisLinda avatar
By Skylar DavisLinda
at 2017-03-31T10:58
來求指點~ 我爸有兩台 iphone 使用同個 apple id 一台是中國 sim 卡, 另一台是 台灣 sim 卡 發生的狀況是, 不管誰打了哪支電話, 另一支會跟著響 這種狀況好詭異, 請問要怎麼解? - ...

LINE上架贈圖"啊!內心框不小心跑出來了

Connor avatar
By Connor
at 2017-03-31T10:57
各位鄉民好, 今天又上架了一組我的新貼圖: and#34;啊!內心框不小心跑出來了…!and#34; Line貼圖商店的網址在這邊: http://line.me/S/sticker/1410590 比較清楚的預覽圖可以看這邊: http://imgur.com/a/c0Moe 作者的貼圖全作品網址在這邊: ...

國泰世華Combo卡無法加入apple pay

Gilbert avatar
By Gilbert
at 2017-03-31T10:44
各位大大你好, 已經爬文N次,設定也改過N次,客服也始終沒有解決的辦法。版上有大大提供的方法還是沒辦法解決,有大大還有其他方法能告知嗎,感謝! http://i.imgur.com/TQDOJIm.jpg ----- Sent from JPTT on my iPhone - ...

原創貼圖贈圖活動-鄉民小妹打籃球

Quintina avatar
By Quintina
at 2017-03-31T10:19
大家好 打給後 胎軋後 弄了三個月的貼圖經歷一波三折上架啦!!! Line的審核好嚴格RRRRR 先看看預覽圖 (文末有贈圖活動) http://imgur.com/YCdZeCl http://imgur.com/LjDbhrC 為了讓自己對籃球與PTT的熱愛充份發揮; 希望每一個喜歡籃球的朋 ...