I need a PWA version of my website ([login to view URL]), but this project is just the checkout part of it and I want a website following all the PWA guidelines and be incredible fast. Scoring at least 90 at pageinsights.
The interfaces I need are:
1 - "login" / "register", will have 2 options to register:
1.1 - a form, with: nome, sobrenome, cpf (cpf mask), data nascimento, telefone, cep, cidade, estado, pais, rua, numero, complemento, bairro, email, checkbox "I accept the terms"
1.2 - scan a QR code, send this to an API, which will send back some of the above form values, and the you need to fill all values from the API, and request others that still needed
1.3 - show form errors (from api - json format), or success
1.4 - LOGIN option, e-mail / password / facebook login / google login - you will send this info to our API and we return with success / error message
2 - type password
the register process request an e-mail confirmation, so, the success message will ask for the user to confirm their email. after that, I need an interface where the user will type his password / with confirmation, and after that, will send the user to "checkout" again, but next step
3 - checkout step 2 - Payment - form:
3.1 - Coupon Code (optional)
3.2 - Payment Info: radio with 3 options (Cartão de Credito / Boleto / Débito Online), if "credit card", show more fields: Nome do Titular, CPF, Data de Nascimento, Numero do Cartão, Expiry Date (month and year), CVV, numero de parcelas (installments), checkbox (wish to use a different address), if checked, show all address fields again
4 - checkout step 3 - revision
Button to finish the checkout
Show the total values, and all ORDER information
5 - order confirmation - payment successful, refused or pending, and order information / details.
All those steps already exists in our site, so, need to use same fields and visual identity.
We have low budget, and expect experience creating PWA / AMP / fast websites. The stack behind this project should be anything, since it is just the frontend, but we prefer something similar to:
[login to view URL]
The stack you choose will be a part of the BID decision, so, WITH YOUR BID, SAY WHAT KIND OF STACK you are planning to USE.
And don't forget, you need to use our visual identity.
CTO of ScubiBlue