English | Русский
This website is an elegant, minimal portfolio page for a professional high-end retoucher.
The main point of the site is to display high-quality images to potential clients. Our biggest concern is large loading time increased by the size of the pictures. Lazyload JS library let's us show the low-quality versions of the images while the full image is being loaded. We are also using lossless compression on the images.
There are some custom-written features like a custom JS slider, magnetic email button that focuses user's attention on it's content and cursor replaced by a css shape that transforms according to the object it hovers on.
Bootstrap helped with building the website according to the column layout grid.
We moved this project from Gulp and using the Astro framework because it's faster performance & better user experience.
SVG is being used throughout the project so that user experience feels more smooth. If user's browser does not support SVG we automatically switch to PNG.
The website is also responsive and all of the features are mobile-friendly.
The website is deployed on https://rinaveremejchik.com
- Typescript
- Astro
- Sass
- Lazyload JS Lib
- Gsap
- Jquery
- Bootstrap
All commands are run from the root of the project, from a terminal:
| Command | Action |
|---|---|
npm install |
Installs dependencies |
npm run dev |
Starts local dev server at localhost:3000 |
npm run build |
Build your production site to ./dist/ |
npm run preview |
Preview your build locally, before deploying |
| :--------------------- | :----------------------------------------------- |