Jump to content

Which layout looks better?

maxib7
By maxib7
in Off Topic
 Share
Posted

Hello everyone! I'm conflicted between two different layouts for a registration screen.

 

Here's one

LLJYBIO.png

 

 

Here's the other (I'm not sure if a card if appropriate here, so I'm a little unsure)

hRBoeaW.png

 

 

 

 

Here's a version with a wider card

uWLJoCR.png

 

 

 

So which one do you think looks better for a mobile application? Which one would you prefer to you?

Any input is greatly appreciated thank you.

No... I'm not ready for my thread to die, not yet.... nooooo......

Link to comment
Share on other sites
Link to post
Share on other sites
Posted

Definitly the second one

TIP: zoom out ;)

Link to comment
Share on other sites
Link to post
Share on other sites
Posted

Second

n0ah1897, on 05 Mar 2014 - 2:08 PM, said:  "Computers are like girls. It's whats in the inside that matters.  I don't know about you, but I like my girls like I like my cases. Just as beautiful on the inside as the outside."

Link to comment
Share on other sites
Link to post
Share on other sites
Posted

Also the red top bar seems to big

n0ah1897, on 05 Mar 2014 - 2:08 PM, said:  "Computers are like girls. It's whats in the inside that matters.  I don't know about you, but I like my girls like I like my cases. Just as beautiful on the inside as the outside."

Link to comment
Share on other sites
Link to post
Share on other sites
Posted
  • Author

Definitly the second one

TIP: zoom out ;)

 

Sorry. It's a really big image and I couldn't figure out how to re-size pictures on here

No... I'm not ready for my thread to die, not yet.... nooooo......

Link to comment
Share on other sites
Link to post
Share on other sites
Posted

Second one, but I'd personally try create something which is an actual 'Sign-Up' button, rather than a tick. 

Link to comment
Share on other sites
Link to post
Share on other sites
Posted

3rd one

Main Gaming PC (new): HP Omen 30L || i9 10850K || RTX 3070 || 512GB WD Blue NVME || 2TB HDD, 4TB HDD, 8TB HDD ||  750W P2 ||  16GB HyperX Black DDR4

Main Gaming PC (old, still own) : Intel Core i7 7700K @5.0Ghz || GPU: GTX 1080 Seahawk EK X || Motherboard: Maximus VIII Impact || Case: Fractal Design Define Nano S || RAM : 32GB Corsair Vengeance LPX 

Cooling: EK XRES D5 100mm || Alphacool ST30 280mm w/ Vardars || Alphacool ST30 240mm w/ Vardars || Swiftech 3/8 x 1/2'' Lok-Seal Compressions || Swiftech EVGA Hydrocopper Block || Primochill Advanced LRT Orange || Distilled Water

Folding@Home Rig: 2x X5690s @4.6Ghz || GPUs: 2x Radeon HD 7990 || Motherboard: EVGA SR-2 || Case: Corsair 900D || RAM: 48GB Corsair Dominator GT 2000Mhz CL9

Ethereum Mining Rig: Pentium G4400 || Gigabyte Z170X-UD5 TH || 2x GTX 1060s (Samsung & Hynix) 1x GTX 1070 (Micron), 2x RX480s BIOS modded (Samsung), 1x R9 290X 8GB, 1x GTX 1660 Super = ~ 195 Mh/s

Peripherals: 3x U2412M (5760x1200), 1x U3011 (2560x1600) || Logitech G710 (Cherry Blues) || Logitech G600 || Brainwavz HM5 with @Gofspar Mod 

Laptop: Dell XPS 15 || "Infinity Edge" 4K IPS Screen || i7 7700HQ || GTX 1050 || 16GB 2400Mhz RAM 

 

Link to comment
Share on other sites
Link to post
Share on other sites
Posted

The second. I'm a big fan of material design, and keeping it familiar to other software is always good. 

Help me I'm surrounded by morons.

Link to comment
Share on other sites
Link to post
Share on other sites
Posted

The second design follows Google Material Design more accurately. So that's why its better imo. 

Link to comment
Share on other sites
Link to post
Share on other sites
Posted
  • Author

Also the red top bar seems to big

 

That's because it's a tab activity. The normal tool bar looks like this

 

The tabs add the extra space

 

3yblsI9.png

No... I'm not ready for my thread to die, not yet.... nooooo......

Link to comment
Share on other sites
Link to post
Share on other sites
Posted

2nd, love Google's material design (check out the background of my profile  ;) )

Blue Jay

CPU: Intel Core i7 6700k (OC'd 4.4GHz) Cooler: CM Hyper 212 Evo Mobo: MSI Z170A Gaming Pro Carbon GPU: EVGA GTX 950 SSC RAM: Crucial Ballistix Sport 8GB (1x8GB) SSD: Samsung 850 EVO 250 GB HDD: Seagate Barracuda 1TB Case: NZXT S340 Black/Blue PSU: Corsair CX430M

 

Other Stuff

Monitor: Acer H236HL BID Mouse: Logitech G502 Proteus Spectrum Keyboard: I don't even know Mouse Pad: SteelSeries QcK Headset: Turtle Beach X12

 

GitHub

Link to comment
Share on other sites
Link to post
Share on other sites
Posted
  • Author

Second one, but I'd personally try create something which is an actual 'Sign-Up' button, rather than a tick. 

 

I tried but it looked awkward with the card and then a button below it like I have in the first 

No... I'm not ready for my thread to die, not yet.... nooooo......

Link to comment
Share on other sites
Link to post
Share on other sites
Posted

I tried but it looked awkward with the card and then a button below it like I have in the first 

 

Hmmmm, i guess no one would really misunderstand what the tick is for. Pretty obvious it's to complete the registration, so second one. 

Link to comment
Share on other sites
Link to post
Share on other sites
Posted

I like the second one, but for most people, its likely that the first option would be far more intuitive for them, even though it's obvious for us.

Useful threads: Code of Conduct || Unofficial LTT Beginners Guide || Forum FAQ

CPU: Intel Core i5 4440 GPU: GTX 760 MOBO: Asrock Z97 Anniversary RAM: 8GB Adata @ 1600 Mhz Case: Define R4 SSD: Kingston V300 128 GB

HDD: 1TB Seagate Barracuda NAS: 3TB Seagate Barracudas in RAID 1 PSU: EVGA 600B (600W 80+ Bronze) Display: LG 23MP75 (1080p IPS @ 60hz) 

Link to comment
Share on other sites
Link to post
Share on other sites
Posted

Second one.

i7 4790K || R9 290X + R9 290 || 16GB G.Skill TridentX 1866 || Gigabyte Z97MX Gaming 5 || Crucial MX100 256GB || WD Caviar Blue 1TB

Link to comment
Share on other sites
Link to post
Share on other sites
Posted
  • Author

The second design follows Google Material Design more accurately. So that's why its better imo. 

 

Well that's a little iffy. The first one does too. You can have text fields with no card behind them (like in the first picture) and I'm stretching the use of the card a little bit. I'm concerned with having too many cards in my app because then it'll just look repetitive and boring. Also the floating action button on the bottom right is also stretching the rules a bit. Technically your only supposed to have one in your entire app that is devoted to one purpose that characterizes your app. I already have one for my main screen

 

Right here:

 

3yblsI9.png

No... I'm not ready for my thread to die, not yet.... nooooo......

Link to comment
Share on other sites
Link to post
Share on other sites
Posted

Sorry. It's a really big image and I couldn't figure out how to re-size pictures on here

 

You could have put each image and scale it down in photoshop so we don't have zoom out to infinity!

Link to comment
Share on other sites
Link to post
Share on other sites
Posted

Well that's a little iffy. The first one does too. You can have text fields with no card behind them (like in the first picture) and I'm stretching the use of the card a little bit. I'm concerned with having too many cards in my app because then it'll just look repetitive and boring. Also the floating action button on the bottom right is also stretching the rules a bit. Technically your only supposed to have one in your entire app that is devoted to one purpose that characterizes your app. I already have one for my main screen

 

Well its either the first one, for its simplistic design, or the second one with the card. 

Link to comment
Share on other sites
Link to post
Share on other sites
Posted
  • Author

Well its either the first one, for its simplistic design, or the second one with the card. 

 

yeah and the more I look at it the more I'm thinking the second one it better

No... I'm not ready for my thread to die, not yet.... nooooo......

Link to comment
Share on other sites
Link to post
Share on other sites
Posted
  • Author

All the suggestions on the last screen was super helpful thank you everyone but I must ask you again.

 

Which one looks better. This time it's a long list. These pictures only show the top of it but it scrolls all the way down to seven periods. So just imagine the rest of it becuase the bottom half looks the same as the top half

 

 

The first one here is a layout with cards. The gripe I have about this is it's a large list with very similar data so the cards seem to distract the eyes here because they are so repetitive.

 

VJ9LNln.jpg

 

 

So for this second I went with more of a list like layout you would see in the gmail app for phones

 

RlXxFef.jpg

 

 

 

Again any suggestions, advice, or any comments are greatly appreciated. Thanks!

 

 

 

EDIT: I know there needs to be some spacing between the words and the blue lines. I just haven't fixed it yet

No... I'm not ready for my thread to die, not yet.... nooooo......

Link to comment
Share on other sites
Link to post
Share on other sites
Posted

Second one. Or make one big card.

Link to comment
Share on other sites
Link to post
Share on other sites
Posted

Second one.

Main rig on profile

VAULT - File Server

Spoiler

Intel Core i5 11400 w/ Shadow Rock LP, 2x16GB SP GAMING 3200MHz CL16, ASUS PRIME Z590-A, 2x LSI 9211-8i, Fractal Define 7, 256GB Team MP33, 3x 6TB WD Red Pro (general storage), 3x 1TB Seagate Barracuda (dumping ground), 3x 8TB WD White-Label (Plex) (all 3 arrays in their respective Windows Parity storage spaces), Corsair RM750x, Windows 11 Education

Sleeper HP Pavilion A6137C

Spoiler

Intel Core i7 6700K @ 4.4GHz, 4x8GB G.SKILL Ares 1800MHz CL10, ASUS Z170M-E D3, 128GB Team MP33, 1TB Seagate Barracuda, 320GB Samsung Spinpoint (for video capture), MSI GTX 970 100ME, EVGA 650G1, Windows 10 Pro

Mac Mini (Late 2020)

Spoiler

Apple M1, 8GB RAM, 256GB, macOS Sonoma

Consoles: Softmodded 1.4 Xbox w/ 500GB HDD, Xbox 360 Elite 120GB Falcon, XB1X w/2TB MX500, Xbox Series X, PS1 1001, PS2 Slim 70000 w/ FreeMcBoot, PS4 Pro 7015B 1TB (retired), PS5 Digital, Nintendo Switch OLED, Nintendo Wii RVL-001 (black)

Link to comment
Share on other sites
Link to post
Share on other sites
Posted

I like the second one but I think there's a lot of retards out there so go with the first one. Make it blankly obvious for people. 

Link to comment
Share on other sites
Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share
Go to topic listing Off Topic

×