Classic-Style Web Upload Component Design
Budget: $30 – $250 CAD
I need a UI designer to create a responsive web upload component for photos in classic style. The component should only accept jpeg, jpg, and png file types. Key features include:
- UI Design including css and js (vanilla) code for a web upload component.
- The upload component be responsive.
- It should just allow photos of type: jpeg, jpg and png.
- Photo should be smaller than 5MB.
- The component should allow either clicking "click to upload" or drag and drop area.
- After uploading the user should click a "process image" button.
- process image button will fire a async call mocked out (you can make a sleep for 5 seconds).
- During the waiting for the response of the api it should be prompted a loading bar with 4 states: Uploading picture (2 Secs), Processing Image (2 secs), Looking for errors (2 secs), Preparing response (1 Sec).
- With the response the upload component should be hidden and show now a response widget containing: List of errors (List), Observation: TEXT, solutions: TEXT, Suggestions: TEXT. This widget will have a process another image button in the botton right position.
- This web upload component should be compatible at least with chrome and safari.
Expected outcome:
- HTML, CSS, VanillaJS code (no nodejs or other framwork is necessary).
- No integration is needed, you give me code that works in isolation.
- You are not expected to deliver something that actually deals with backend responses.
Ideal candidates should have strong UI design experience, particularly with classic styles, and be proficient in CSS and JS.
I am not expecting to pay more than 35 USD for this.
Optional: if you post your quote with a draft or figma I can go up to 50 USD.
- UI Design including css and js (vanilla) code for a web upload component.
- The upload component be responsive.
- It should just allow photos of type: jpeg, jpg and png.
- Photo should be smaller than 5MB.
- The component should allow either clicking "click to upload" or drag and drop area.
- After uploading the user should click a "process image" button.
- process image button will fire a async call mocked out (you can make a sleep for 5 seconds).
- During the waiting for the response of the api it should be prompted a loading bar with 4 states: Uploading picture (2 Secs), Processing Image (2 secs), Looking for errors (2 secs), Preparing response (1 Sec).
- With the response the upload component should be hidden and show now a response widget containing: List of errors (List), Observation: TEXT, solutions: TEXT, Suggestions: TEXT. This widget will have a process another image button in the botton right position.
- This web upload component should be compatible at least with chrome and safari.
Expected outcome:
- HTML, CSS, VanillaJS code (no nodejs or other framwork is necessary).
- No integration is needed, you give me code that works in isolation.
- You are not expected to deliver something that actually deals with backend responses.
Ideal candidates should have strong UI design experience, particularly with classic styles, and be proficient in CSS and JS.
I am not expecting to pay more than 35 USD for this.
Optional: if you post your quote with a draft or figma I can go up to 50 USD.