I'm currently putting together a page that consists of a grid of offers (say 24).
The data I want to display along with a pic means that each offer will take up approx 200-300px square - not dissimilar to the way Fiverr displays gigs. I'll display them 3 abreast on larger screens down to 1 abreast on mobile.
Each grid-item has 2 link destinations, one going to the offer detail page and the other directly out to a third party website where the offer resides.
Ideally the customer needs to be told what they need to do before reaching the site - Facebook, Twitter, App download, Sign up etc. I've looked at similar sites and they tend to deal with this badly - ranging from trying to cram some information into the original grid item to just linking out with no info.
I have the instructions available - but I don't want to take either of the above routes, so I've been looking at other options:
- Responsive modal.
- Extend the grid cell downwards.
- Slide an overlay in from left/right.
- Don't allow the user to link out from the grid.
I'm really unsure at to which approach to take if any - I'm no UX expert, so any advice or alternative solutions appreciated.