DEV Community

Cover image for Quick A/B Poll: Which card style you like better?

Quick A/B Poll: Which card style you like better?

Alvaro Saburido on August 05, 2020

UPDATE 10/08/2020: Thanks to everyone that took the time to vote and provide valuable feedback in this poll. You guys rock 🤘. I decided to use ...
Collapse
 
daniel13rady profile image
Daniel Brady

Tough choice, they both look good! But I’ll go with option B, because the design elements more closely align with Nintendo, in my mind: clean, slanted, character logos as shadows of the characters, etc.

One suggestion: try making the “Finish Battle” text in ALL-CAPS and see how that changes the feel of it.

Collapse
 
alvarosabu profile image
Alvaro Saburido

Thanks for the feedback, really apprieciate it.

Collapse
 
johntalamo profile image
JohnTalamo

They're both good but I prefer A. My eyes went right to that one. The colors pop and the characters look like they're more 3-D versus looking more 2-D on white.

Collapse
 
alvarosabu profile image
Alvaro Saburido

I have the same feeling, I'm trying to step away from my overall romance with minimalistic white interfaces with something riskier

Collapse
 
horrorofpartybeach profile image
Emma

I really like both designs but I went for Option A because I find it easier to read/see things against a darker background. I'd suggest increasing the contrast of some of the icons on the bottom black banner of Option A; from an accessibility point of view, this would be a great improvement.

I also really like the shadows behind Falco and Link on Option B and I agree with Daniel that this design is more closely aligned with Nintendo.

Great job on the designs, they're both awesome!

Collapse
 
huncyrus profile image
huncyrus

This is hard, because like elements from each side.

I like the format of the B:

  • Rounded corners
  • Full figures
  • Figure logo as background
  • Name written down

And I like from the "A":

  • Colors
  • "vs" artwork (i know, littlebit copied from street fighter)
  • The red rounded button from below for finishing a battle

The second one because focus more the important UI elements and has better call-to-action feelin' (e.g.: drive better the eye what to do, more intuitive).
The first one way cleaner by feeling.

Would be interesting to have both scheme for dark/light theme ;)

Collapse
 
nombrekeff profile image
Keff

I like B more, but would like A if they used the same styling (ie. rounder borders, shadows, and badge)

Collapse
 
dabit_coder profile image
David Oliva Tirado

They are both awesome! But I think that the white one looks a bit better. It's less overloaded with things (the logos behind the characters are SICK) and in general looks more clean and elegant.

Really good job!

Collapse
 
alvarosabu profile image
Alvaro Saburido

Not a bad idea tho, thanks for replying

Collapse
 
lmioco profile image
lmioco

I prefer the second one

Collapse
 
alexanderjanke profile image
Alex Janke

🦄
(but reducing the shadow just a little bit)

Collapse
 
darkwiiplayer profile image
𒎏Wii 🏳️‍⚧️

I'mma go with B, but not by much. They are both pretty cool :D

Collapse
 
alvarosabu profile image
Alvaro Saburido

Hey thanks for the awesome feedback, I totally get your point actually I didn't put any names because I wasn't happy how the fonts looked on it, I still trying to find the correct font to it.

Collapse
 
joelbonetr profile image
JoelBonetR 🥇

I love the way characters goes out of the card and the darker "footer" on A, but I love the information about wins and character names, and also the finish battle style on B 😂

Collapse
 
fkhadra profile image
Fadi Khadra

Both are gorgeous. But I would go for A. The "VS" is really eye-catching. Would you share the app when done ?

Collapse
 
alvarosabu profile image
Alvaro Saburido

Thank you very much, yes Im planning on having a demo version of the app with mock data on my portfolio site, :D.

Collapse
 
xukinorris profile image
Xukinorris

I always go for the clean that uses the least dark colors. Nice job btw!

Collapse
 
samwightt profile image
Sam Wight

Option B with Option A's button looks esp good to me! Not sure the button design looks like a button or matches with the rounded corners.

Collapse
 
andrewbaisden profile image
Andrew Baisden

A has more colour and B looks subdued and simple. Both look good however A looks like it belongs in a AAA game whereas B looks like it was made for a more simple clone of a AAA game in my opinion.

Collapse
 
becoolie4u2 profile image
becoolie4u2

🦄 but make the "vs" a little bigger and I second a dark version as well.

Collapse
 
beard_corsini profile image
Andrew Corsini

These both look amazing!! I'm a dark mode guy myself, so I'm more inclined towards A, but I think either one would be a great fit. Nice Work!

Collapse
 
patarapolw profile image
Pacharapol Withayasakpunt

❤️

I do prefer light mode better, but Option A provides more colorfulness and contrast.

Collapse
 
didacsf profile image
Dídac Sementé Fernández

A all the way!

Collapse
 
markoshiva profile image
Marko Shiva

Option A is far better.

Collapse
 
sarcasmappreciated profile image
Benson Li

B is cleaner and more easily descipherable

Collapse
 
lukeofficial profile image
Luke

❤️

Collapse
 
gabrielrufino profile image
Gabriel Rufino

❤️

Collapse
 
virenb profile image
Viren B

🦄

Collapse
 
cromatikap profile image
cromatikap

❤️

Collapse
 
harikayedidi profile image
Harika Yedidi

🦄 IMO B highlights the characters and is more neat looking than A, especially with the CTA.

Collapse
 
dothtm profile image
dotHTM

Depends entirely on the background, as presented on white, then A.

But on a dark background, I suspect B.