Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Having trouble with flat design, help please

Featured Replies

kapa1y.jpg

 

Here is my attempt at flat design. I just feel i went wrong somewhere. I'm self taught, so i haven't taken any classes on design theory. What is wrong with this design? Typography? Colour scheme? Negative Space? Any flat design tips, greatly appreciated.

 

 

 

In my opinion - the orange gap between the "New Business Deals" and your footer (I assume) looks too wide.

 

Apart from that, it looks OK.

 

Flat design does make you feel like you have done half the job but think of the time spent by designers adding drop-shadows, rounded corner, gradients etc.

is it based on a grid? looks like lots of elements don't line up with others - are all the margings/padding multiples of a bascic unit - e.g. 20px?

  • Author

is it based on a grid? looks like lots of elements don't line up with others - are all the margings/padding multiples of a bascic unit - e.g. 20px?

No, i haven't used grids. I use smart guides in Photoshop to line up elements but I'm going to use grids now.

Edited by Mr Burns

Hi, I agree with MG1878 that the margin between the 'new business deals' and footer is too large. Maybe try to work on a better colour palette. Try using this flat design colour palette to start you off. The colours on that site are muted and more suited to flat design.

Hi. I think the fact that each element has it's own background makes the body colour a little redundant. You'd be better off using a light, neutral colour for the background, and having a particular section orange with content to reflect this.

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.