Booklet

author

Ismail El Azizi

Design

Let's Design This in Figma

design

Design

|

LET'S DESIGN THIS IN FIGMA

GET THE ILLUSTRATIONS
I get all the illustration from iconscout plugin on figma, just search for girl then check the packs

PREPARE THE GROUP
Create 5 rectangles with a size of 375 x 812, put one illustration on each one of them then make all that as one group

ADD TITLES
Add a title to each part of the group and keep it centered inside

ADD DETAILS
Make clouds and sun using the pen tool, keep it as a had drawing to match the style Of the illustrations then put that inside each part of the group

PUT ALL THAT INSIDE AN IPHONE X FRAME
Add new iPhone x frame, then put the group inside the frame, align it to the left to take only the first illustration

MAKE 5 COPIES
Make 4 copies of the iphone X frame then adjust the content inside each frames, keep one part centred on each frame

ADD THE PROGRESS BAR Make a simple progress bar, add it to every screen then change the position of the pink element inside based on the progress. add also a skip button to let users escape.

ADD INTERACTION Add an on Drag interaction for each screen to go to the next one, use the Smart Animate animation 1300ms

AND DONE!

More booklets by Ismail El Azizi

More Design booklets

Your recently viewed booklets

  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
See all booklets