let’s dev GmbH & Co. KG - The brand for groundbreaking custom software

Blog

Top!

let’s dev | Scroll to top
let’s dev | Scroll to next content item

Hello

let’s dev | Scroll to previous content item
let’s dev Blog | Apple Wallet
by Maik
26. Oktober 2018

Apple Wallet

The Wallet app has offered Apple users a convenient way to use digital coupons and boarding passes for years. With the upcoming market launch of the associated payment service Apple Pay in Germany, the app's application possibilities will multiply once again. For this reason, we will take a closer look at Apple Wallet in the following.

Boarding Pass in Apple Wallet

Figure 1: A boarding pass in Apple Wallet on the iPhone and Apple Watch.

What exactly is Wallet?

Wallet offers the user the possibility to store various types of tickets such as trading cards, credit cards, travel passes, etc. digitally on Apple devices in the form of so-called Passes. The user can then view, use and manage his passes in the app. Wallet is available on all iPhones with iOS 6 or later and on the Apple Watch.

Passes are the digital representation of classic tickets and credit cards. They can contain images and barcodes and be updated via push notification.

Server-client communication

Figure 2: Server-client communication in Apple Wallet

Creation of a pass

Passes go through four phases in their life cycle: Creation, delivery, management and ultimate redemption.

Wallet covers the administration in connection with the user. The process of delivery, creation and redemption of the pass is defined by the creator, although Apple gives us a lot of freedom here. Depending on the pass type, the passes can contain a different arrangement of texts, images and barcodes, whereby the style, formatting, colors and inserted images are specified by the creator.

How the Pass is "delivered" to the user is also freely selectable. The pass can be stored in apps via the PassKit API, sent by e-mail or inserted on websites. Furthermore, Apple does not impose any requirements regarding the programming language to be used, since the "mechanisms" behind the provision of the passport come from the creator. Therefore, the conditions for redeeming the pass are also determined by the creator and must be coordinated and agreed with the internal organizational structure. In addition, the pass data can be updated at any time via push notification.

Pass Styles

Figure 3: The five available pass styles

Various design options

Let's first get an overview of the pass style sets provided by Apple. The style sets are part of the API and are fixed. There are five different styles for the Passes:

Each Pass Style has its own layouts and restrictions for the information fields it contains. The style is defined by specifying the corresponding key in the header of a .json file ( pass.json ), which contains all the information for filling the fields. The fields in the pass can basically be divided into four subareas:

Depending on the pass style, the layout and number of available fields differ. However, all Pass Styles have one basic thing in common: There is always a header, primary/secondary content areas, and finally a barcode field.

Layout Boarding Pass

Figure 4: Layout of the boarding pass with corresponding code snippet of the pass.json file

The use of the different pass styles is explained in more detail below.

Coupon

The coupon is the ideal basis for creating one-off vouchers for special offers, for example, and its perforated top and bottom edges simulate the familiar tear-off slip. Due to its small number of fields, it remains simple and clear.

Boarding Pass

For travel tickets of all kinds, Boarding Pass offers the right layout. The primary content area is divided into a variety of small fields to have all relevant travel data quickly in view.

Event Ticket

By integrating a background image, Event Ticket is suitable for creating creative ticket designs for movie tickets or concert tickets, for example.

Store Card

Although the layout of the Store Card is almost identical to the layout of the coupon, the Store Card offers other possibilities due to its prominent content field. The remaining amount of credit and bonus cards can be displayed and updated here. The user thus always has an insight into his current account balance.

Generic

If the desired purpose cannot be fulfilled by the four already mentioned pass types, Apple additionally offers the possibility of a versatile basis with the Generic Pass. The Generic Pass is usually used as a membership card, for example, because a profile picture can be integrated here.

The inner values

The files that make up the Pass are then compiled in the so-called Pass Package. This consists mainly of the images present in the passport and the already mentioned pass.json. Additionally, subfolders for localized versions of the pass can be created in the package. The final compilation then ends with the file extension .pkpass, but in principle it works like a normal ZIP file.

In order to understand how we can fill which type of pass, we now need to take a look at the pass's files. If you unpack a .pkpass archive, you will get several files:

Layout Boarding Pass

Figure 5: Typical file structure of a .pkpass archive

Variations for Apple Watch

As already mentioned, Wallet also offers solutions for passes on the Apple Watch. The passes basically work the same way, but the layout of the fields is adapted to the square display of the Apple Watch; the user can then scroll vertically through the pass. For the creation of passes, Apple always uses the common barcode format when choosing the common QR code when choosing the barcode format, as this is the easiest to map on the display of the Apple Watch. Apple Watch display without causing space problems.

Layout Boarding Pass

Figure 6: The layout of the boarding pass adapted for the Apple Watch

All in one hand with Apple Wallet

Mobile payment methods are revolutionizing the way people shop and pay. The Wallet system has positioned itself as one of the pioneers of this movement. Small or medium-sized companies in particular can benefit from Apple's sophisticated card system, offer their customers special added value with relatively little effort, and position themselves in the e-commerce sector at the same time.

Since the launch of the Wallet app in 2012, the digital wallet has enjoyed several revisions and represents a huge step forward for mobile payments to date. In the U.S. and other participating countries, a variety of popular bank and loyalty cards are now smoothly integrated into the app.

Unfortunately, the adaptation rate in Germany is still quite low, although the technology has been available for years. At least the technical implementation is no longer a problem, since the necessary infrastructure for the cards is provided by Apple. However, we are sure that the topic of Wallet will pick up speed again with the upcoming activation of the Apple Pay service.

Kortpress by let's dev - now also for Google Passes

Digital cards and tickets, such as those offered by Google Pay Passes and Apple Wallet (which we already reported on in an earlier article) are becoming increasingly important as a result of digitization, replacing paper and plastic cards. However, creating passes for your customers can be too much of a hassle for stores or other businesses.

We offer a solution for this: Kortpress. This solution allows you to create customized cards by choosing from a variety of different layouts and uses. The creation is done online in just a few steps without any programming knowledge. Easily adapt the existing layouts to your corporate design or existing design templates.

Kortpress was designed to be flexible to your individual specifications and also easy to integrate into an existing IT infrastructure. Automated distribution of passes or automated campaign management is also easily possible with Kortpress - we will be happy to support you in making this a reality.

Are you interested in Kortpress or would you like an individual automated solution to create passes for your company? Then contact us. We will be happy to advise you and work out a suitable solution for you.

More articles from our blog

let’s dev Blog | Sketch, Figma & Co. - We take a look at the most popular UI und Prototyping Tools in 2021

Corporate

Sketch, Figma & Co. - We take a look at the most popular UI und Prototyping Tools in 2021

by Ellen

2021-07-15

Read more
let’s dev Blog | Tailwind: An innovative project for the future use of old wind turbines

Corporate

Tailwind: An innovative project for the future use of old wind turbines

by Karl

2021-06-24

Read more
let’s dev Blog |

Corporate

by Julian

2021-06-10

Read more
let’s dev Blog | Smart Prognosis of Energy with Allocation of Resources

Corporate

Smart Prognosis of Energy with Allocation of Resources

by Karl

2021-02-18

Read more
let’s dev Blog | Dasoman - Data-Sovereignty-Manager

Corporate

Dasoman - Data-Sovereignty-Manager

by Karl

2021-01-11

Read more
let’s dev Blog | We look back on the past months - And wish all the best for the coming year 2021!

Corporate

We look back on the past months - And wish all the best for the coming year 2021!

by Julian

2020-12-17

Read more
let’s dev Blog | iOS User Interface Tests

Technical

iOS User Interface Tests

by Nicolas

2020-11-12

Read more
let’s dev Blog | Adobe Max - Online for the first time

Corporate

Adobe Max - Online for the first time

by Julia

2020-10-29

Read more
let’s dev Blog | CAN2BLE

Technical

CAN2BLE

by Raphael

2020-09-24

Read more
let’s dev Blog | Mensch und Computer 2020 - Digital Change in the Flow of Time

Corporate

Mensch und Computer 2020 - Digital Change in the Flow of Time

by UX Team

2020-09-18

Read more
let’s dev Blog | Neumorphism – A new era of user interface design?

Technical

Neumorphism – A new era of user interface design?

by Julian

2020-08-13

Read more
let’s dev Blog | UX Research Part 3 - UX Methods

Technical

UX Research Part 3 - UX Methods

by Elena

2020-05-28

Read more
let’s dev Blog | UX Research Part 2 - What is UCD and what does User Research have to do with it?

Technical

UX Research Part 2 - What is UCD and what does User Research have to do with it?

by Elena

2020-04-23

Read more
let’s dev Blog | go-digital promotes establishment of home office workstations

Corporate

go-digital promotes establishment of home office workstations

by Karl

2020-03-19

Read more
let’s dev Blog | Google Passes - Card Management on Android Devices

Technical

Google Passes - Card Management on Android Devices

by Michelle

2020-03-12

Read more
let’s dev Blog | 100% code coverage in software testing - a reasonable goal?

Technical

100% code coverage in software testing - a reasonable goal?

by Raphael

2020-03-06

Read more
let’s dev Blog | Swift UI - Simple and fast implementation of user interfaces

Technical

Swift UI - Simple and fast implementation of user interfaces

by Tobias

2020-03-02

Read more
let’s dev Blog | In dialog with the business juniors - Exciting insights into business start-ups and digital transformation

Corporate

In dialog with the business juniors - Exciting insights into business start-ups and digital transformation

by Julian

2020-02-27

Read more
let’s dev Blog | Simplified testing of iOS push notifications in the simulator with Xcode 11.4

Technical

Simplified testing of iOS push notifications in the simulator with Xcode 11.4

by Manuel

2020-02-26

Read more
let’s dev Blog | National meeting of the consortium of the SPEAR research project at let's dev in Karlsruhe

Corporate

National meeting of the consortium of the SPEAR research project at let's dev in Karlsruhe

by Karl

2020-01-27

Read more
let’s dev Blog | UX Research Part 1 - Why User Research is so important

Technical

UX Research Part 1 - Why User Research is so important

by Elena

2020-01-23

Read more
let’s dev Blog | Dark Mode

Technical

Dark Mode

by Elisa

2020-01-09

Read more
let’s dev Blog | We wish you a Merry Christmas - And a Happy New Year!

Corporate

We wish you a Merry Christmas - And a Happy New Year!

by Julian

2019-12-20

Read more
let’s dev Blog | Exchange on the topic of digitization with the Business Club Luxembourg at the Embassy of Luxembourg in Berlin

Corporate

Exchange on the topic of digitization with the Business Club Luxembourg at the Embassy of Luxembourg in Berlin

by Karl

2019-12-17

Read more
let’s dev Blog | DaSoMan at the Internet+ Expo in Foshan (China)

Corporate

DaSoMan at the Internet+ Expo in Foshan (China)

by Karl

2019-12-13

Read more
let’s dev Blog | Google Play Console: Pre-Launch Reports

Technical

Google Play Console: Pre-Launch Reports

by Fabian

2019-12-11

Read more
let’s dev Blog | DevFest 2019 in Hamburg

Technical

DevFest 2019 in Hamburg

by Julian

2019-12-05

Read more
let’s dev Blog | Vernissage digital art in the media theater of the Humboldt University Berlin

Corporate

Vernissage digital art in the media theater of the Humboldt University Berlin

by Karl

2019-11-21

Read more
let’s dev Blog | World Usability Day 2019 in Karlsruhe - let's dev supports as main sponsor

Corporate

World Usability Day 2019 in Karlsruhe - let's dev supports as main sponsor

by Aileen

2019-11-11

Read more
let’s dev Blog | Gutted - Open Day at the Alter Schlachthof Karlsruhe 2019

Corporate

Gutted - Open Day at the Alter Schlachthof Karlsruhe 2019

by Julian

2019-09-26

Read more
let’s dev Blog | Mensch und Computer 2019 - Conference on User Experience and Usability in Hamburg

Corporate

Mensch und Computer 2019 - Conference on User Experience and Usability in Hamburg

by Elena

2019-09-17

Read more
let’s dev Blog | Business and Enterprise App Distribution on iOS

Technical

Business and Enterprise App Distribution on iOS

by Aileen

2019-08-05

Read more
let’s dev Blog | Digital Transformation - Chances and Challenges in the Automotive Industry, Agriculture and New Technologies

Corporate

Digital Transformation - Chances and Challenges in the Automotive Industry, Agriculture and New Technologies

by Karl

2019-07-17

Read more
let’s dev Blog | let's dev supports runners at the 7th KIT Championship

Corporate

let's dev supports runners at the 7th KIT Championship

by Karl

2019-07-05

Read more
let’s dev Blog | Automated testing of C++ code with Google Test and Google Mock - Part 2

Technical

Automated testing of C++ code with Google Test and Google Mock - Part 2

by Arne

2019-06-13

Read more
let’s dev Blog | Apple WWDC 2019: These are the highlights of the keynote

Technical

Apple WWDC 2019: These are the highlights of the keynote

by Nicolas

2019-06-05

Read more
let’s dev Blog | App Builders 2019

Technical

App Builders 2019

by Nicolas

2019-05-23

Read more
let’s dev Blog | Official opening of the Consolidation and Expansion Center (FUX)

Corporate

Official opening of the Consolidation and Expansion Center (FUX)

by Helena

2019-04-15

Read more
let’s dev Blog | Delegation from Nottingham to visit the Alter Schlachthof in Karlsruhe

Corporate

Delegation from Nottingham to visit the Alter Schlachthof in Karlsruhe

by Helena

2019-04-14

Read more
let’s dev Blog | The time has come: We are moving!

Corporate

The time has come: We are moving!

by Helena

2019-03-26

Read more
let’s dev Blog | Automated testing of C++ code with frameworks - part 1

Technical

Automated testing of C++ code with frameworks - part 1

by Arne

2019-02-20

Read more
let’s dev Blog | The app in the Google Play Store

Technical

The app in the Google Play Store

by Elisa

2019-01-24

Read more
let’s dev Blog | „UX Day“ 2018

Corporate

„UX Day“ 2018

by Aileen

2018-12-17

Read more
let’s dev Blog | let's dev supports SG Siemens volleyball players from Karlsruhe

Corporate

let's dev supports SG Siemens volleyball players from Karlsruhe

by Helena

2018-12-04

Read more
let’s dev Blog | SMEs shape digitalization - SME Conference 2018

Corporate

SMEs shape digitalization - SME Conference 2018

by Helena

2018-11-12

Read more
let’s dev Blog | „Mensch und Computer“ 2018

Corporate

„Mensch und Computer“ 2018

by Judith

2018-09-24

Read more
let’s dev Blog | State Design Pattern in Android

Technical

State Design Pattern in Android

by Thomas

2018-09-17

Read more
let’s dev Blog | let's dev is an authorized consulting company in the „go-digital“ funding program

Corporate

let's dev is an authorized consulting company in the „go-digital“ funding program

by Helena

2018-09-01

Read more
let’s dev Blog | App Design & Development Conference 2018

Corporate

App Design & Development Conference 2018

by Helena

2018-08-14

Read more
let’s dev Blog | iOS 12: The top new features at a glance

Technical

iOS 12: The top new features at a glance

by Nicolas

2018-07-17

Read more
let’s dev Blog | let's dev at CEBIT

Corporate

let's dev at CEBIT

by Karl

2018-06-11

Read more
let’s dev Blog | Introduction to User Interface (UI) Testing with Espresso

Technical

Introduction to User Interface (UI) Testing with Espresso

by Raphael

2018-06-07

Read more
let’s dev Blog | The app in the Apple App Store: what information is needed?

Technical

The app in the Apple App Store: what information is needed?

by Aileen

2018-04-27

Read more
let’s dev Blog | Smart Pointer in C++

Technical

Smart Pointer in C++

by Matthias

2018-04-01

Read more
let’s dev Blog | User interface design for iPhone X: all innovations at a glance

Technical

User interface design for iPhone X: all innovations at a glance

by Helena

2018-02-07

Read more
let’s dev Blog | WebVR - Virtual Reality Experience in the Browser with the A-Frame Framework

Technical

WebVR - Virtual Reality Experience in the Browser with the A-Frame Framework

by Judith

2018-01-10

Read more
let’s dev Blog | Deutsche Bahn Open Data Hackathon

Corporate

Deutsche Bahn Open Data Hackathon

by Karl

2015-03-31

Read more
let’s dev Blog | Blur effects under iOS 7

Technical

Blur effects under iOS 7

by Katja

2014-04-24

Read more
let’s dev Blog | Beyond App Store - iOS application distribution

Technical

Beyond App Store - iOS application distribution

by Karl

2012-08-27

Read more
let’s dev Blog | Front-end architecture - Model View Presenter and Message Bus

Technical

Front-end architecture - Model View Presenter and Message Bus

by Karl

2011-03-08

Read more