2018 MacBook Air
As part of the Apple MarCom Interactive team, I developed web and retail concepts for the 2018 MacBook Air launch – Apple’s thinnest, lightest notebook yet. This multi-disciplinary process involved a series of motion studies, computational experiments, and Web UX/UI to ideate new interactions and visual language that brought the product to life.
Solution
Motion GraphicsWeb UXExperiential design
Role
UI Designer
Date
2018
Behind theWeb Launch
An iterative process shaped by in-depth motion studies that captured the unique features and essence of the new MacBook Air.
Meet the Hero
The hero moment was crafted through a series of motion studies, which explored how the product image and logo can move together to quickly convey the lightness and materiality of the new MacBook Air.
Expressive highlights
We wanted users to immediately understand key features of the product – the sharpness of Retina, fingerprinting for Touch ID, and dark-mode UI on macOS. As part of initial explorations, we crafted several type animations as expressive introductions to each key feature.
Dynamic scrolling
To shift away from static experiences, we also explored ways to immerse users in compelling feature stories with each scroll. The example below showcases how we can highlight Retina through strong imagery, saturated colors, and bold copy.
Next-GenRetail Concepts
Concepts for product reveals that transformed the Apple Store and how customers navigate within it.
Interacting with Air
Inspired by computational art, I wanted to visually convey the motion and emotion of “Air” by prototyping interactive installations using a combination of Processing, motion sensors, and a webcam.
Working closely with the development team, we refined the prototype to achieve the desired visual response and interaction behavior. The refined design is a wall of letters that responds to movement, dispersing and moving along with the customer to reveal the letters “A I R” at the center.
Applications for retail
The prototype was proposed as an innovative opportunity to extend the product launch from screen and into the retail environment, creating unexpected in-store experiences when users move around the store, and interact with the product.
The proposed design would also be used as interactive screen savers or storefront installations to showcase the new product
We also explored ways for the letters to form words and shapes to introduce the unique features of the new MacBook Air.
Translating materiality
Half way through the exploration, our team received updated visual assets from the Art Direction team. The new direction centered around colorful fabric motifs used to convey the lightness of the product and vibrancy of the screen display. Taking into account this new motif, I explored ways to convey the materiality of fabric using the same concept developed in the previous prototypes.
The fabric motif could be brought to life via in-store interactive displays, leveraging the sensing of the user’s motion to move the fabric around, revealing the word AIR in the background.
Thank you!
Back to top ↑
2018 MacBook Air
As part of the Apple MarCom Interactive team, I developed web and retail concepts for the 2018 MacBook Air launch – Apple’s thinnest, lightest notebook yet. This multi-disciplinary process involved a series of motion studies, computational experiments, and Web UX/UI to ideate new interactions and visual language that brought the product to life.
Solution
Motion GraphicsWeb UXExperiential design
Role
UI Designer
Date
2018
Behind theWeb Launch
An iterative process shaped by in-depth motion studies that captured the unique features and essence of the new MacBook Air.
Meet the Hero
The hero moment was crafted through a series of motion studies, which explored how the product image and logo can move together to quickly convey the lightness and materiality of the new MacBook Air.
Expressive highlights
We wanted users to immediately understand key features of the product – the sharpness of Retina, fingerprinting for Touch ID, and dark-mode UI on macOS. As part of initial explorations, we crafted several type animations as expressive introductions to each key feature.
Dynamic scrolling
To shift away from static experiences, we also explored ways to immerse users in compelling feature stories with each scroll. The example below showcases how we can highlight Retina through strong imagery, saturated colors, and bold copy.
Next-GenRetail Concepts
Concepts for product reveals that transformed the Apple Store and how customers navigate within it.
Interacting with Air
Inspired by computational art, I wanted to visually convey the motion and emotion of “Air” by prototyping interactive installations using a combination of Processing, motion sensors, and a webcam.
Working closely with the development team, we refined the prototype to achieve the desired visual response and interaction behavior. The refined design is a wall of letters that responds to movement, dispersing and moving along with the customer to reveal the letters “A I R” at the center.
Applications for retail
The prototype was proposed as an innovative opportunity to extend the product launch from screen and into the retail environment, creating unexpected in-store experiences when users move around the store, and interact with the product.
The proposed design would also be used as interactive screen savers or storefront installations to showcase the new product
We also explored ways for the letters to form words and shapes to introduce the unique features of the new MacBook Air.
Translating materiality
Half way through the exploration, our team received updated visual assets from the Art Direction team. The new direction centered around colorful fabric motifs used to convey the lightness of the product and vibrancy of the screen display. Taking into account this new motif, I explored ways to convey the materiality of fabric using the same concept developed in the previous prototypes.
The fabric motif could be brought to life via in-store interactive displays, leveraging the sensing of the user’s motion to move the fabric around, revealing the word AIR in the background.
Thank you!
Back to top ↑
Copyright © 2026 Sean Lin
2018 MacBook Air
As part of the Apple MarCom Interactive team, I developed web and retail concepts for the 2018 MacBook Air launch – Apple’s thinnest, lightest notebook yet. This multi-disciplinary process involved a series of motion studies, computational experiments, and Web UX/UI to ideate new interactions and visual language that brought the product to life.
Solution
Motion GraphicsWeb UXExperiential design
Role
UI Designer
Date
2018
Behind theWeb Launch
An iterative process shaped by in-depth motion studies that captured the unique features and essence of the new MacBook Air.
Meet the Hero
The hero moment was crafted through a series of motion studies, which explored how the product image and logo can move together to quickly convey the lightness and materiality of the new MacBook Air.
Expressive highlights
We wanted users to immediately understand key features of the product – the sharpness of Retina, fingerprinting for Touch ID, and dark-mode UI on macOS. As part of initial explorations, we crafted several type animations as expressive introductions to each key feature.
Dynamic scrolling
To shift away from static experiences, we also explored ways to immerse users in compelling feature stories with each scroll. The example below showcases how we can highlight Retina through strong imagery, saturated colors, and bold copy.
Next-GenRetail Concepts
Concepts for product reveals that transformed the Apple Store and how customers navigate within it.
Interacting with Air
Inspired by computational art, I wanted to visually convey the motion and emotion of “Air” by prototyping interactive installations using a combination of Processing, motion sensors, and a webcam.
Working closely with the development team, we refined the prototype to achieve the desired visual response and interaction behavior. The refined design is a wall of letters that responds to movement, dispersing and moving along with the customer to reveal the letters “A I R” at the center.
Applications for retail
The prototype was proposed as an innovative opportunity to extend the product launch from screen and into the retail environment, creating unexpected in-store experiences when users move around the store, and interact with the product.
The proposed design would also be used as interactive screen savers or storefront installations to showcase the new product
We also explored ways for the letters to form words and shapes to introduce the unique features of the new MacBook Air.
Translating materiality
Half way through the exploration, our team received updated visual assets from the Art Direction team. The new direction centered around colorful fabric motifs used to convey the lightness of the product and vibrancy of the screen display. Taking into account this new motif, I explored ways to convey the materiality of fabric using the same concept developed in the previous prototypes.
The fabric motif could be brought to life via in-store interactive displays, leveraging the sensing of the user’s motion to move the fabric around, revealing the word AIR in the background.
Thank you!
Back to top ↑
Copyright © 2026 Sean Lin