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

Publish Date: Aug 5 '20

122 37

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 Option A (even if B got more votes 🦄) with a few changes inspired by the feedback you gave me and considering the component surroundings:

Card A is the real deal (dark background, vibrant colors, etc., all evoke the feelings of competition, passion, aggression, etc.).
by @AnkushThakur

I added the character names, the logos in the bg similar to option B, and I added a small indicator of the stage just at the top.

I like the contrast that the card gives, it's eye-catching in all that light tournament page and clearly invites the user to check the next battle kinda feeling.

Here is another version of it

And how it looks in the same tournament page but in knockout phase:

Does that mean I threw the Option B to the trash 🗑? Not really, I actually going to use it on a page with historical of matches, because there doesn't need that much dynamism and contrast looks nice and clean.

I'm really happy with the result. and all the cool discussions happening on the comments, thanks, everyone!

Hi there 👋 . I'm a big fan of Super Smash Bros since I was a little kid.

I'm doing some quick design for a tournament app in Vue and I could use your feedback, which card you like the most?.

Option A: Vote heart ❤️
Option B: Vote 🦄

Disclaimer: Characters and names are property of Nintendo of America.

Comments 37 total

Alex JankeAug 5, 2020
🦄
(but reducing the shadow just a little bit)
Pacharapol WithayasakpuntAug 5, 2020
❤️

I do prefer light mode better, but Option A provides more colorfulness and contrast.
KeffAug 5, 2020
I like B more, but would like A if they used the same styling (ie. rounder borders, shadows, and badge)
lmiocoAug 5, 2020
I prefer the second one
cromatikapAug 5, 2020
❤️
Dídac Sementé FernándezAug 5, 2020
A all the way!
Daniel BradyAug 5, 2020
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.
- Alvaro SaburidoAug 5, 2020
  Thanks for the feedback, really apprieciate it.
Viren BAug 5, 2020
🦄
JohnTalamoAug 5, 2020
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.
- Alvaro SaburidoAug 5, 2020
  I have the same feeling, I'm trying to step away from my overall romance with minimalistic white interfaces with something riskier
Gabriel RufinoAug 5, 2020
❤️
Alvaro SaburidoAug 5, 2020
Not a bad idea tho, thanks for replying
Sam WightAug 5, 2020
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.
Andrew BaisdenAug 5, 2020
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.
Andrew CorsiniAug 5, 2020
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!
becoolie4u2Aug 5, 2020
🦄 but make the "vs" a little bigger and I second a dark version as well.
XukinorrisAug 6, 2020
I always go for the clean that uses the least dark colors. Nice job btw!
David Oliva TiradoAug 6, 2020
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!
Fadi KhadraAug 6, 2020
Both are gorgeous. But I would go for A. The "VS" is really eye-catching. Would you share the app when done ?
- Alvaro SaburidoAug 6, 2020
  Thank you very much, yes Im planning on having a demo version of the app with mock data on my portfolio site, :D.
EmmaAug 6, 2020
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!
LukeAug 6, 2020
❤️
huncyrusAug 6, 2020
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 ;)
Alvaro SaburidoAug 6, 2020
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.
JoelBonetR 🥇Aug 6, 2020
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 😂
Marko ShivaAug 6, 2020
Option A is far better.
𒎏Wii 🏳️‍⚧️Aug 6, 2020
I'mma go with B, but not by much. They are both pretty cool :D
dotHTMAug 6, 2020
Depends entirely on the background, as presented on white, then A.

But on a dark background, I suspect B.
Benson LiAug 6, 2020
B is cleaner and more easily descipherable
Harika YedidiAug 6, 2020
🦄 IMO B highlights the characters and is more neat looking than A, especially with the CTA.

Add comment

Alvaro Saburido @alvarosabu

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

Comments 37 total