2

I'm building an iOS only app that helps users understand their Twitter data.

I'm not sure what is the best practice in terms of User Experience and User Exception. I'm using white pressable cards, that upon pressing the card it'll take him to a new screen with more information regards the pressed card.

Few questions:

1) Have I approach this the right way?

2) Will the users understand that the card is clickable?

3) Does it too hard to scan due the cards amount/order?

Bonus question:

Design/UI wise, is the acceptable?

Thank you!

enter image description here

Improve this question
4
  • It can blend a little into the background. Changing colour of the cards might make them difficult to read. Instead a darker background should make the cards stand out. Although, I don't know how to make them feel "clickable".
    – jitendragarg
    Commented Jun 25, 2017 at 9:18
  • Also, you can probably create a border that stand out. That might work. thumb10.shutterstock.com/display_pic_with_logo/4006420/…
    – jitendragarg
    Commented Jun 25, 2017 at 9:30
  • @jitendragarg Thank you for responding, I might add border if they'll be note visible enough :)
    – Roi Mulia
    Commented Jun 26, 2017 at 7:02
  • What do you mean by "User Exception"?
    – RobbyReindeer
    Commented Jul 10, 2019 at 6:44

1 Answer 1

Reset to default
1

I find ok the approach and I think is ok to have interactive elements that can be clicked in a card layout. Using the same style as in the rest of the app for clickable elements should be enough to suggest the link. You can change the color of the elements in blue on hover and the cursor. You can add an arrow after the clickable title.

For the last question, is important the content in the cards.

Even is an IOA app, the style seems to be Material Design.

You can find more information about cards here: Material Design - Components - Cards.

When to use

Use a card layout when displaying content that:

  • As a collection, comprises multiple data types, such as images, movies, and text

  • Does not require direct comparison (a user is not directly comparing images or text)

  • Supports content of highly variable length, such as comments
  • Contains interactive content, such as +1 buttons or comments
  • Would otherwise be in a grid list but needs to display more content to supplement the image

You can find on Material Design - Components - Cards a similar example, but please note that cards are unnecessary if you have homogeneous content. enter image description here

The white background for the cards is ok with the shadow on a light background if you need a subtle effect.

enter image description here

Improve this answer
1
  • 1
    Thank you Madalina! Much appreciated. Is there a specific way to apply "card design" to iOS, an official guideline or something?
    – Roi Mulia
    Commented Jun 26, 2017 at 7:05

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.