ReDo Offers Tab

[amykirschner]

Issues - It's hard to scan offers, still too much text, pictures small.

• [x] Make Offer Photos much larger and more prominent (think polaroid picture)

• [x] Underneath Picture is Offer Title (black /bold)

• [x] Underneath Title is Name of Business Offering (smaller font/gray)

1st line of text is not visible

maybe 3 across?

responsive table

[ziyan-junaideen]

@amykirschner : photos are resized to be 240x240px. If we are going to have some thing like 3 columns, we will need images to be at least about 400px wide. Shall i set the limits to some thing like 512x512px.

[ziyan-junaideen]

@amykirschner some thing like this?

[ziyan-junaideen]

The stretched look and feel of the image is because they are 240x240. Currently it is stretched to 370px. For ultra dense screens it is good to have twice the size (4 times the area).

[ziyan-junaideen]

I just noticed the checkbox above... after some updates...

[ziyan-junaideen]

And some thing like this in a phone.

[amykirschner]

That's looking good! Cap title text at 2 lines?

I'm concerned about creating a problem where poorly sized photos get too blurry.
Maybe make full screen 5 photos across? Then we know max photo size of 240x240

[ziyan-junaideen]

One thing we can do is to increase the photo size, but that will only solve the matter for the future.

In the other hand as you said, we can increase the number of columns... we got a 12 grid... we are now at 4 units (4 * 3 = 12).

We can go 4 columns with 3 units width or go 6 columns wide with each column been 2 units.

[ziyan-junaideen]

@amykirschner I think going 6 will be too much, will push an update to 4.

Caping by number of lines, i have an idea, i am not sure if it will work. other wise i will cap it by number of characters so that it will be roughly 2 lines in desktop mode

[amykirschner]

yes - update to 4 sounds good.

If you think it's not buggy :) go ahead and push to production when done and I'll review there.

[ziyan-junaideen]

@amykirschner : I pushed an update not seen the comments about image... and i undid it...

I am making changes to the app so that photos uploaded will store a larger version. No current version is sufficient for our requirements as the largest available is 72px. Just enough for that small box. I am going to add a new polaroid version with a higher resolution.

Unfortunately this will only effect new uploads. Because older images are already resized. So we will see such stretching in any old photo.

[ziyan-junaideen]

If we make the photos small, there won't be much text. Here is how it looks with latest updates. Older photos / orders will be less crisp. The new ones will be fine.

One approach we can take is to push updates to production that will increase image size for new offers. Then after there are like 3 or 6 new offers we can make the new layout to show. Just an idea.

[ziyan-junaideen]

Updates available in staging.

[amykirschner]

@ziyan-junaideen this is looking so good!

[amykirschner]

Notes:

• [x] add spacing between top row and Add New Offer Button

• [x] When I click through on a offer, the photo is too big to comprehend. Can we make photos 50% of that on the individual offer page?

• [x] Put the prices in the same line as listing title but make it medium gray instead of bold black

[amykirschner]

When those changes get made, go ahead and push to production and we'll clean up any inconsistencies there. When you push to production can you apply same format to request tab? THANK YOU!

[ziyan-junaideen]

Understood

[ziyan-junaideen]

[amykirschner]

@ziyan-junaideen thank you!

I think the main photos on the offer tab are still too large. Not many people have high res logos that size. Can you make it default to the same size as on the click through page. That looks good! Maybe 75%

[amykirschner]

I'm so happy with this new layout!

[amykirschner]

oops one more - when I decrease to a mobile size view, photos stay same size, I assumed they would shrink to match screen size. ?

[ziyan-junaideen]

@amykirschner You mean when in mobile to be full screen... ya sure i will push and update.

[ziyan-junaideen]

[ziyan-junaideen]

For smaller screens it will be full width (not very clear above because the background is also white) and for tablets and above it will be half screen.

[ziyan-junaideen]

@amykirschner ^^

[amykirschner]

@ziyan-junaideen sorry for the delay. I think we're good here! I need to redo some of the photos but I think it's just a manual fix no code needed. Closing.

THANK YOU!