Design For Smaller Devices That Scales

Let’s talk about some of the low-hanging fruit. To save space, our previous design used smaller fields with placeholder text as labels. There was nothing indicating which fields are required, and which ones can be skipped. If you changed the payment method after filling in the buyer’s information, you’d have to fill it all over again. Because of the single screen layout, there was no room for descriptive error states and messaging.

We resolved all these issues (and more) by increasing the tap areas and creating larger floating-label fields, making it easier to group tasks, digest information, and show field-related error messaging. We questioned the requirement of every field and collapsed or removed unnecessary ones so they wouldn’t get in the way. We also introduced smart pre-fills, so that the buyer’s information could be pulled from their credit card and be automatically filled and saved when changing the payment method.

In addition to that, to make typing buyer information even faster and avoid typos, we introduced email domain shortcuts.

The design scales perfectly to devices of any size. As Universe is starting to focus more on Attractions, events with constant venues and setups, iPads will be more used and we’re planning to look into some of the iPad specific layout adjustments in the future.