Download as docx, pdf, or txt
Download as docx, pdf, or txt
You are on page 1of 4

Book Cover Editor

CyanGate Assignment

Welcome to the programming challenge. You are requested to create a web application that allows users to select a
book from the dropdown list, import a cover image from their local, style the book’s title and author name in a textbox on
the imported cover image, and preview and download the edited image to their local.

 You will use the NY Times Books API to retrieve only 5-10 book data to use their titles and author names. Show
those books on the dropdown (Image 1)
 When the user selects a book from the dropdown, ask the user to import a cover image from their local
computer(Image 2)
 Add two textboxes to the book cover one for the Book Title and the other for the Author's Name (Image 3)
o Fill the textbox values retrieved from the API call for the selected book
o Allow user to drag the textbox on the image and change font size, text color(like Red, Orange, Blue, etc.),
and letter spacing of the textboxes individually
 Show the image preview to the user, and allow to download the edited image(Image 5)

Example User Scenario:

1. Choose the Little Prince book from the dropdown


2. Import a cover image
3. See the book name and author name automatically added as textboxes
4. Click the Name textbox and change the color to Orange, increase the font size, and drag it to the center
5. Click the Author textbox and change the color to White, drag it to the center
6. Click Save, see the preview
7. Go back to the Edit page to make other changes, increase the Author text’s font size
8. Click Save, see the preview, and download the image to the local computer

Notes:

 Develop the app on any modern JavaScript Framework


 Push your code to any version control system as a private repository and share the repo with
osezen@cyangate.com
 You are free to use any 3rd party library for your needs
 Add your notes(if you have) and run/build commands to the README.md file
 If you cannot finish the app completely, submit it anyways
 Ask/contact if any concept or requirement is not clear to you
 Feel free to adapt or change the mockup design/layout provided below
 We encourage you to push your imagination and creativity
Image 1

Image 2
Image 3

Image 4
Image 5

Book Cover Art: Nino Vujasinovic

You might also like