Mobile Devices as Design Elements

Using smartphones and tablets in web designs not only looks attractive, it also quickly conveys a message of being cutting-edge and mobile friendly. (You don’t have to drink the Cupertino Kool-Aid to recognize that the iPhone and iPad are really beautiful.) We’ve picked out some great examples of agencies’, apps’ and mobile services’ websites to illustrate how using mobile devices as design elements can work.

Mobile devices in agency promotions

The devices being included in the following designs is not accidental. Including the devices in the layout of the site quickly implies that the agency focuses on that type of work.

Given that developing for mobile devices and tablets is considered cutting-edge, the inclusion of such an element implies great things about a design agency—if the agency does indeed handle mobile work. (Slapping an iPad on an old-school agency’s website just because it looks flashy will mislead visitors.)

Consider your project and what a device might communicate. Sometimes getting literal is a powerful approach. A few great examples of this approach include:

Mobile devices in app promotions

If you happen to be building a site that promotes a mobile app, it absolutely makes sense to include an image of the device in the site’s design. This not only tells us that it’s a mobile app, but which devices it targets. This is especially helpful if the app is native to anything other than iPhones. Given that the majority of the app market is focused on Apple, a website is a great opportunity to capture the attention of other consumers. Here are some beautiful sites to inspire your own work:

Mobile services

If your site offers a service that includes mobile support, nothing communicates this like images of the actual device. The following services use such an approach:


Using a smartphone or tablet in your design conveys a lot of information quickly. But don’t think you have to generate your own images of all these devices; others have done the hard work for us: