Coder to draw animated flower vase and add flowers - repost

This project received 3 bids from talented freelancers with an average bid price of $ USD.

Get free quotes for a project like this
Project Budget
$250 - $750 USD
Total Bids
Project Description

View a virtual bouquet of flowers in a vase on screen. Insert a new flower into the vase. See links for examples.

We assume you are a coder so the web site design will be under a separate quote. v0.9 bidders might want to bid v1.2 (flying butterflies) as well. This is a project good for REPEAT business!

• v0.9 – Basic flower draw and add routines (this quotation)

• v1.0 – Basic web site design with a pop-up invitation and FAQ (a separate quotation)

• v1.1 – Share with Friends – social media pop-up with Facebook widget (small web add on)

• v1.2 – Animated butterflies and add butterfly – fly over the flowers

• v2.0 – Enhanced animation – v2.0 graphics, 3D flowers move like in in wind, clicking a flower displays donor name and message

v0.9 flower page – THIS QUOTATION

Code Requirements

• “Work for hire”. At the end of development and completion of payment code shall be property of MLD Foundation. Contract shall be signed before coding starts, developer agrees not to remarket/reuse the code for the purpose of a implementing a fund raising platform. All source code and reasonable documentation will be provided.

• Code must run on standard web browsers – IE, Safari, Chrome

o HTML v5, CSS v3, No FLASH, MySQL database that we will supply

o Must display on mobile devices (iPhone, Android, Blackberry)

• JavaScript is OK

• PHP … controlling software and MySQL access to be written in PHP.

MySQL Database

There will be much more data in this database – these are the key fields

• Event Details: Number of flowers, Number of butterflies, Flower set code

DRAW FLOWERS - Given a number from 1-50 and a code for the flower type, draw a vase with that number of flowers in it.

o Vase is opaque with a MLD foundation butterfly logo on it

o Several flower type sets … semi-realistic virtual art

• Starter flower choices are

o S - spring flower mix (10 graphics) with corresponding greenery

o D – daffodils (5 graphics) with corresponding greenery

• The vase starts with one flower in the center, each additional flower is added slightly to the side of and randomly in front of the prior flowers

• Each additional flower added varies slightly from the flower before it

• Slightly rotated and to the side of the prior flower

• On semi-random basis add to left or right side – need to keep some sense of overall balance but a full alternating pattern is not desired

• Flowers randomly chosen from the bouquet set for that particular flower code

o Each flower code will have up to 10 different flower graphics to randomly choose from (should code for a variable number of graphics)

• Sample result might be somewhat like this:

o [url removed, login to view]

o [url removed, login to view]

o [url removed, login to view]

• Logo for vase is

o [url removed, login to view]

o As flowers are added they start to spread out … at 50 flowers the vase is visually full and the bouquet is very broad

o The vase draw should take no more than 3 seconds with flowers being initially drawn every [url removed, login to view] second. When the flower count is over 12, the delay between redraws should be calculated to complete in 3 seconds.

o Periodically, every 10 flowers, add greenery

• For mobile devices, if draw performance suffers then drawing 10 flowers at a time or a static display of the vase is acceptable.

ADD – add a flower to the vase

o Instantly display the current vase

o Add another flower

• either flying it in and inserting it into the vase … should take 2-3 seconds

• or by “growing” it … the background dims slightly while the flower stem reveals from bottom (in the vase) to top so the viewer is focused on, and can see the flower grow. After a small delay, the vase & existing flowers brighten and the new flower blends in.

o On mobile devices the ADD animation still needs to run even if the existing vase draw is expedited.

This code will be the main display page for a fund raising site - the more funds raised, the more graphics drawn.

Looking to make some money?

  • Set your budget and the timeframe
  • Outline your proposal
  • Get paid for your work

Hire Freelancers who also bid on this project

    • Forbes
    • The New York Times
    • Time
    • Wall Street Journal
    • Times Online