# Make it Look Like the Design

DevFeed: [Make it Look Like the Design](<https://devfeed.tech/articles/make-it-look-like-the-design-19358.md>)

Original publisher: [Read original article](<https://www.codenameone.com/blog/make-it-look-the-same-as-the-design/>)

Author: Steve Hannah

Published: 2017-08-28T00:00:00Z

Content type: tutorial

Language: en

Sources: [CodeName One](<https://devfeed.tech/sources/codename-one.md>)

Topics: [User interface design](<https://devfeed.tech/topics/ui-design.md>), [mobile-app-development](<https://devfeed.tech/topics/mobile-app-development.md>), [Mobile](<https://devfeed.tech/topics/mobile.md>), [Tutorial](<https://devfeed.tech/topics/tutorial.md>)

Tags: [app-development](<https://devfeed.tech/tags/app-development.md>), [design](<https://devfeed.tech/tags/design.md>), [fonts](<https://devfeed.tech/tags/fonts.md>), [margin](<https://devfeed.tech/tags/margin.md>), [mobile](<https://devfeed.tech/tags/mobile.md>), [mobile-app-development](<https://devfeed.tech/tags/mobile-app-development.md>), [ui](<https://devfeed.tech/tags/ui.md>), [ui-design](<https://devfeed.tech/tags/ui-design.md>), [user-interface](<https://devfeed.tech/tags/user-interface.md>), [user-interface-design](<https://devfeed.tech/tags/user-interface-design.md>)

## AI overview

This tutorial explains how to make a mobile app's user interface closely match a design. It identifies fonts, colors, padding, margins, alignment, and preserving UI sections across screen sizes as key areas to address.

## Source excerpt

The Michael Jackson documentary, "This is It", included a behind-the-scenes look at Michael Jackson's preparation for his final tour, that tragically would never happen. In one scene, he has an exchange with the keyboard player that goes roughly as follows: Michael Jackson (to keyboard player) : That isn't right Keyboard player : How do you want it? I can do it anyway you want it. Michael Jackson : Just make it sound like on my CD.