Photo Before-n-After with ROI and Zoom. Javascript/Jquery based, Responsive and nice interface

Requirement in a quick glance.

We want a image before and after app which is mainly used for previewing portrait photos.

[Please see the attached document for detail with images]

Feature 1) ROI Zoom:

In our images the ROI (Region of Interest) is the human face. The coordinates will be provided. On the click of a button, the image need to zoomed to the face.

Feature 2) Before After handle icon:

The handle used for dragging between before and after image needed to be as responsive as the below example.

[url removed, login to view]

Feature 3) Four buttons:

The app have to incorporate four buttons which does the following functions

a) image before

• When clicked on this button, the 'before' image is displayed

b) image after

• When clicked on this button, the 'after' image is displayed

c) face zoom

• When clicked on this button, zoom to ROI

d) full image

Feature 4) Zoom handle

An image zoom handle is needed to zoom in or out of the image. Zoom percentage needed to be displayed near to the handle

Feature 5) Responsive Design:

a) The image needs to be click and drag-able (if it is zoomed)

b) The app have to take the size of the div it contains

c) The image should not be zoomed beyond its original size

d) If the user drag and increase the size of the window, the app have to change its dimensions to fit to the new window size.

Feature 6) Compatibility:

All mobiles browsers and compatible across browsers desktop browsers.

Tool need to be used: Visual studio 2013 (The developed javascript app will be used in a bootstrap asp.net project. so it needed to be compatible)

Your bid will be split into 4 milestones of equal size and following is the project execution steps.

1) First milestone will be escrowed as soon as project is accepted by you.

2) You develop the application, obfuscate the javascripts and deliver.

3) If this meets most of the requirement, I will release the first milestone and escrow the second.

4) After all the requirements met, you release the final version with open source code. I will release the second milestone and escrow the third.

5) Your code will be thoroughly tested by me for two weeks. You fix the bugs and compatibility issues during this period. I will release the third milestone and escrow the fourth.

6) Your code goes in the main website and will be used by users. Any bugs or issues occurs within a time frame of 2 months will be fix by you. At the end of two months, the fourth escrow will be released.

Thanks for reading till the end. To filter out the spammers (sorry for this) please write "Awake" in your bid.

Happy bidding

Evner: Javascript, jQuery / Prototype

Se mere: zoom design studio, website to fix your photos, studio design app, steps to develop website, open source asp net website, nice icon design, jquery version, jquery release, in n out application, glance net, fix website compatibility issues, div fix website, design tool for icon images, bootstrap asp.net, asp.net responsive design, app icon design studio, javascript zoom pan jquery, javascript zoom jquery, javascript zoom website, javascript zoom boxes

Om arbejdsgiveren:
( 128 bedømmelser ) United States, Korea, Republic of

Projekt ID: #8667645

Tildelt til:


Hi! As discussed, I will create similar Photo Before-n-After with ROI and Zoom but this time using Jquery/Js only without HTML5 Canvas.

$100 USD in 7 dage
(31 bedømmelser)

2 freelancere byder i gennemsnit $176 på dette job


A proposal has not yet been provided

$252 USD in 3 dage
(33 bedømmelser)