I need to build a photo gallery for my client's mobile website. He is a doctor, and has before and after photos of his patients. Each patient has 1 to 3 BEFORE photos, and 1 to 3 AFTER photos. That is, a maximum number of 6 photos per patient.
There is a MYSQL database photo gallery on his desktop website which you will have access to, to pull the necessary data from.
There are a few features about how the mobile photo gallery should work that I need to make sure you can deliver.
To better convey what I need, I have attached a MOCKUP of -
a) Main Photo Gallery, b) Preload Screen, c) Vertical View, d) Horizontal View.
See mockup at: [url removed, login to view]
Please review this graphic, then, read below:
1) Need fast load time of images in mobile browser, with preload message.
2) Resize images with responsive design to fit the width of all the popular mobile screen devices in today's market.
3) Resize images with responsive design for both the vertical and horiztonal viewing mode on the mobile device. There will be 2 photos on each screen. One photo of the before picture, and one photo of the after picture.
4) If a patient has a total of 6 photos, the first set of before and after photos should show first, and when they swipe the screen with their finger, the photo gallery loads the SECOND set of before and after photos for the same patient. Until all the photos for each patient appear. But, there will only be 2 photos on a mobile screen at any one time.
5) There is a unique Patient Case Number for each set of patient photos that will label each patient.
6) If a viewer pulls up the photo gallery holding their cell phone vertically, there must be a note added under the photos "For best viewing, turn phone horizontal." And, if a viewer pulls up the photo gallery holding their cell phone horizontal, there is NO instructional statement.
7) The patient photos are all sized with the same width, but they are NOT the same size in height. The height will vary for SOME procedures, not all. So, if holding the phone vertically, this is not a problem. But, when you change the phone to a horizontal view, you will not be able to see the full height of the photo on one screen. THIS IS OKAY! The viewer can use their finger to scroll up and down in the horizontal view to compare the before and after photos side-by-side. That's the main CONCERN - the viewer needs to be able to see the doctor's work by COMPARING the BEFORE image to the AFTER image on his patient, so they can see the true results of his work.
I hope you will find that after reading through all these items that you see from my example mockup that what I am requesting is not terribly difficult. I have had trouble in the past with other programmers not giving me exactly what I client needs. So - I thought this time, the mockup would help.
Also - I need to see that you have done previous work like this. Please provide me URLS to see other photo galleries you have built in the past on a mobile website.
I will be pulling up your URLS in a cross browser check software to verify that your previous photo gallery work renders and functions properly on all the latest and most popular mobile devices on the market today. So - please - only experienced programmers should apply for this project.
As soon as I find a programmer who can deliver a quality photo gallery on a mobile website, then, I will proceed to upsell all my other clients with a mobile photo gallery. So, I need someone who can do these photo galleries for ALL my clients, and who can provide me with quality work that will make my clients happy. Happy clients mean more work for you and me! :-)
Thanks for taking the time to read my post.
22 freelancers are bidding on average $624 for this job
Hi, Thanks for sharing this. Please allow us to serve best solution with our expertise in this domain. Please check your private message box. Thanks Fourorange