Ruby on Rails and UI expert needed for web design and development

We have a basic site up at [[login to view URL]][1] We need someone to complete the website with admin features, user accounts, etc. Adriff allows people to make high quality html flyers by just emailing information to an email address.? We need the following things in place: 1. Design and layout of the site. We want the site to be really cool and 2.0ish 2. Once a user creates a flyer, we need the functionality whereby they can go to a certain link and make edits to the Price, Description, etc. 3. Payment through paypal 4. Admin interface for customer support. We can discuss more when you reply so as to crystallize the requirements. Basically, you should be completely comfortable in RoR and have an excellent handle on UI Design. We look forward to working with you.? Detailed spec is also provided. ### Skills Required: [Rails][2], [UI Design][3], [Web design][4] ## Deliverables **Spec for Adriff-web** ? What is adriff? ? Adriff allows realtors and landlords to create high quality htmlflyers by email for posting on classifieds sites. Upon sending an empty email to adriff, a user gets a text templatewhich has fields such as: Price: Title: Description: Features: ? etc etc. The user just fills out the template, attaches as manypictures as he wants and sends the email to adriff. Adriff processes the emailand within a few mintues sends back seven html flyers to the user to choosefrom. The user can now cut and paste the html code from any of the flyers toonline classifieds sites such as craigslist, backpage, etc. ? Features that are currently working: 1. The user has the ability to send an empty email and get atemplate to fill out. 2. The user can fill out the template, attach pictures and sendthe email to adriff and he will get seven well designed html flyers by emailthat he can use to post on classifieds sites. 3. Statistics: The backend keeps track of the views on these adsand sends people stats as to how many views the ad got from what domain, etc. These features are implemented in the backend. We need to be builda website to provide a web interface to the frontend. ? To get an idea of how things currently work, you should watch thesmall video at [login to view URL] ? **Things that need to be added to the website:** ? **1. Overall design:** The website, including the first page needs to have a cool web2.0ish look and needs to be redesigned for that. There needs to be a sectionwhere we can embed a marketing video, possible couple of ?€œHow to?€ videos. ? **2. Ad listing/editing/deleting/stats:** A user should be able to login intothe account and see a list of all his current ads (display id? & title). Next to each ad, there shouldbe an option to view, edit, or delete the ad, along with option to see statistics,to pay for the AD, and to delete pictures for that AD. We should also displaythe status of each date (such as? expirydate). ?? ? ? ? When the user chooses to view an ad,a preview of the AD will be shown to him as explained in the editfunctionality. ?? ? ? ? When the user chooses to edit theAD, it should take him to a page where he can edit the various sections of theAD. From the edit page, there should be an option to edit pictures as discussedbelow. ?? ? ? ? A user can delete his one or moreads. When a user does so (and confirms that he indeed wants them deleted), thefrontend needs to notify the backend which in turn will take certainhousekeeping actions such as deleting the pictures corresponding to the ad,etc. A confirmation should be shown to the user that his ads have been deleted. ? **3. Edit functionality:** Currently, there is no edit functionality. When a usersends an email after filling out the template, the flyers get designed and getsent back to him, but if he now wants to change the price, he?€™ll have to resendthe request, basically rinse and repeat the process (it?€™s not that hard, sincehe can just resend the email from his sent folder, but we need to improve uponthat through the web interface) ?? ? ? ? What is needed is a page (edit mode)for the ads belonging to the user. In the edit mode, for each ad, the varioussections such as Price, Description, etc would be laid out and the user canjust go ahead and edit these sections on the website. When the user makes thechanges, these changes will need to be committed to the database. ?? ? ? ? There should be an option to **previewthe flyer** after edit changes have been saved. The web application will senda message to the backend to regenerate flyers for this user for preview. Thebackend will send a local URI (example: C:\\data\\.....\[login to view URL]) that needsto be displayed to the user in a cool fashion, perhaps in an IFrame on the samepage or in a pop-up div. ?? ? ? ? There will also be an option whereby the user can request ?€œresend me the flyers?€ where by the web applicationwill send a message to the backend that will then generate and email the flyersto the user. A confirmation will be displayed to the user that a new set offlyers have been emailed to him. ? **4. Selecting preferred templates:** Currently we only have about 15templates and the user randomly gets 7 out of those 15 templates. Soon we aregoing to have many more templates, (close to 100) and we want to give users aninterface to choose which templates to use for their ads. So the way it wouldwork is this: ?? ? ? ? The very first time the user sendsin an email request, seven flyers will be emailed to him randomly by thebackend. When the user now logs into his web account, he can see all thehundred templates as thumbnails, somewhat like [[login to view URL]][5] .but with a checkbox next to thetemplates. The user can now choose up to seven of these templates and when hecommits his choices, a new set of flyers will get emailed to the user based onhis choices. These choices will be saved in the database, so that when the usersends in a new request, he will get his preferred templates. ?? ? ? ? Obviously, given the large number oftemplates, the thumbnails will have to be paginated. There should be some kindof feedback to the user to see at a glance all his preferred templates (theuser can choose upto 7 preferred templates). For example, there could be anarea near the top of the page that displays the currently selected preferredtemplates. When the user chooses a new template thumbnail, it gets added to theselected list displayed in that part of the page. Also, the user should be ableto remove any of the preferred templates by unchecking or by somesimple/obvious actions on the list of selected/preferred templates. ?? ? ? ? There will be a folder on the localmachine that has the sample flyers (one flyer for each template). These sampleflyers will be shown as thumbnails (and it will shown similar to preview pagein detail when the user clicks on a thumbnail). ?? ? ? ? The templates are organized intocategories. The user should be able to see all the templates in a givencategory. The database will have a list of template names and their categories. ? **5. Statistics:** From the front end, by logging into his account, the user shouldbe able to see the stats on his ads. For accomplishing that, the front endwould send a message to the backend and the backend will come back with thestats urls that need to get rendered as images on the stats page for aparticular AD. We will send a sample page with stats (that actually getsemailed to our customers) - you would need to include that on the website andadd a nice look and feel to it. ? **6. Payment interface:** We need to add? a paymentbutton for each ad in the users account. Upon clicking on that button, the userwill be redirected to paypal to complete the payment for that particular ad. Apayments table will need to be updated in the database with details of thepayment (date, amount, adid, email id, etc.) and confirmation should be shownto the user that payment has been received for an id. The ADS table should bemarked paid for a particular date and the expiry date for that AD should beupdated. Expiry date should be 4 months from the date of payment. ? **7. Admin interface:** ?? ? ? ? Customer support: An admin interfaceneeds to be in place that we can use for customer support. Through thisinterface, we should be able to delete ads, edit ads, mark ads as paid for etc. ?? ? ? ? Template addition: An interface needsto be place that allows us to add more templates if needed. This page will havean upload button where the admin will choose two files (a .html file and [login to view URL] file both having the same name) form his desktop. These files will needto be uploaded to a templates folder on the local machine, and database willneed to be updated. The database will have a templates table that has the nameof the template and category it belongs to (such as funky, solid, etc.). Amessage would need to be sent to the backend to generate sample flyer for thenew template. ? **8. Pictures Handling:** ? For each ad, the usershould be able to delete any picture that he wants. Note, that we don?€™t want afunctionality to add pictures, since pictures can be added by email. We alreadyhave that functionality working. But, we need to be able to delete the picturesfrom the front end. Again, when the user deletes a picture, the back-end needsto be notified so that it can remove the picture from the hosting site and dothe necessary housekeeping. ? **9. Some websites we like:** ?? ? ? ? [[login to view URL]][6] ?? ? ? ? [login to view URL] ? **10. Database details:** We are currently using MySQL 5.0 database with the [login to view URL] will provide the current database schema. You will be free to add additionaltables and additional columns to the existing tables. We have retrofitted thedatabase schema to meet Ruby on Rails model requirements. You can do areverse-scaffold of the current schema if you wish. In any case, make sure thatthe migration encodes the requirements of the current schema (such as fieldlengths, default values, null allowed, foreign keys, etc.) so that the currentbackend continues to work with this database. ? **11. Communication between web application and backend:** ? For now just write dummy functions that returnhard coded values. We will replace it with calls to our Python backend usingour Ruby to Python library. ? ?