VIBRANT PRESENTATION
Nathalia Bavutti
Created on April 6, 2022
More creations to inspire you
THE EUKARYOTIC CELL WITH REVIEW
Presentation
PRIVATE TOUR IN SÃO PAULO
Presentation
FACTS IN THE TIME OF COVID-19
Presentation
AUSSTELLUNG STORYTELLING
Presentation
WOLF ACADEMY
Presentation
STAGE2- LEVEL1-MISSION 2: ANIMATION
Presentation
TANGRAM PRESENTATION
Presentation
Transcript
A look into my web-portfolio
Nathalia Padron Web-developer
01 the inspiration
1
3
2
Modern art 90s
Modern take
Colorful
Created a pinterest board
Browsed behance
90s revival and the presence of 3d art
Resources:
-Icons8
-color palette creator
used a colorful palette
option 1
2
1
option 2
option 1
2
3 flashcards
well organized
option 2
2
carousel
options to slide more pictures
its better for visualization on a laptop, gives you the option to click on the articles to lead you to some different place
option 1
2
1
option 2
option 1
2
3 flashcards
well organized
option 2
2
carousel
options to slide more pictures
its better for visualization on a laptop, gives you the option to click on the articles to lead you to some different place
Improved Accesability
maintanance (I can add pictures later)
my original mockup
My result
LANDING PAGE
What did I use?
Title here
- Bootstrap for the navbar
- Transition for a hover effect on the navbar and used ease in an out for a soothing effect.
- I used a mixing to style all the buttons.
- I used an animation on the text
typing animation
Animation on the navbar
my originalmockup
result
RESPONSIVE
Bootstrap
IMEDIA QUERIES
I used calc to make the font responsive
Pseudoelements for the icons after the some of my work
variables for the font and color palette
I used live sass compiler
and linked to bootstrap
Variables for the different fonts and color palette, mixins
CONTACT FORM
I
I designed a form with pseudoelements ::before for the icons after the some of my work
and hover effects.
Thank you guys, have a nice day!