......                 
   .               ...                                                                                         ..             .............     
     ...:::::                                                                                                ................:::::.        :::::
::::::::                                                                                                    ...............::::::::::::.        
+++                   ...      ..                                                                          .              .:::::::::::::++++:   
++++::::::::::::::...............                                                                          ....                                 
++++:::::::::::::.............                                                                             ......                               
+++::::::::::::::...........                                                                               .........                            
++::::::::::::::..........                                                                                 ...........                          
+::::::::::::::.........                                                                                   .............                        
:::::::::::::........                                                                                       ...............                     
                   ...........                                                                                               ::::::::::::::+++++
                 ............                                                                                                  .:::::::::::::+++
              ..............                                                                                                      :::::::::::::+
            ...............                                                                                                         ::::::::::::
          ................                                                                                                            .:::::::::
        .................                                                                                                               .:::::::

@arek_durlik

Portfolio for a 3D Artist

Technologies used:

                                                            .........                                   
                                                     ...-----+--------+--......                         
                                                 ..++                          +--.....                 
                                              .+---------------------------------------+-...            
                                            +++++###+++-..                          .......-...         
                                          #++++++++++++++++###+++..----------------....-####-----....   
                                        #++++++++++++++++++++++++++###+++...........-#########.-....-+-.
                                      ###############+++++++++++++++++++++++###+-..############-.--...+.
                              .-..  ##########################++++++++++++++++++#-##############-.......
                              +..-####################################++++++++++#.###############.....--
                                ############################################++++#.##############.....--.
                               ################################################+#.############+......-+ 
                           .+####################################################-###########...-...--- 
                        .-.......++#############################################-+#########.......--#+  
                     .-                 --++####################################.########-....-----#--  
                 ..-------------------------------++############################.#+#........------#-.-  
               .                                           +###################+-+....-#####-----##+.+  
            . ----------------------------------------------------.+###########.#.-+-.-+--------##-..-  
           -                                                             +#####.+...-----------+##..--  
         -..-----------------------------------------------------------.....++.....------------###-.+   
        .                                                                 ++.....----------+--+###.#    
      -..--..---------------------------------------------------------..+#......---------++.--.####     
     .                                                                 #.......--------++#+......       
    ......--..-------------------------------------------------------+--......-------++#+--...-         
   +...                                                            +.........-----+++#+-.....           
   #++#--.........--..-------------------------------------------+---.......-----+++#--....             
  -##-.--+++.....                                               +  ........+###+++#+-.....              
 ....+#++++--+###+.............--..---------------------------+---........#####-##-.....                
 ....----#+++++########-.....                               +  .........-###--##+-....-                 
 ++-......----++##############............--..-------------+  .........-####+.#--....                   
 .-###........------+################--...             .-+............+###-+..+-....                    
  +-.................-----++############+#+#++.........-....+#-.+....-###+..+.+...                      
  -+###...................-------+####+---------.-+#+++++.  ...-....-####---+.+..                       
 -.--+##..++-....................------++###+++++----++  ..--#......#####..-..+                         
.+....-+..++####++-..............................--++++---........-######-.#.-                          
 .+.......++##########++--......................................-..######-...+                          
   .........-+###############++--..........####+--................+#######-.+                           
      ...........-+++##############++......--+######-.............########-++                           
         -..............++############-..------...................+########+                            
              -..............--+++#####..+++###########............-++#++-                              
                   -.................-+...+++####+###..............-                                    
                          .....................................                                         
                                 ..........................                                             
                                         ............

This portfolio website was created to showcase a 3D artist's work, combining their vision with a clean, functional, and responsive layout. Every element was carefully considered to deliver a polished user experience, avoiding any unnecessary embellishments.

List of projects, each with a main image or a grid of images on the left, and a description on the right.
Minimalist home page highlighting the artist's work.

A custom lightbox component, built from scratch in React, allows users to view images and videos, as well as switch between them. Image placeholders and preloading ensure smooth transitions between media.

Custom lightbox displaying a photo of a 3D model over a dark background, with a description below.
Custom lightbox showcasing images and videos in an elegant layout.

The site features a custom tab navigation system, ensuring full keyboard accessibility and allowing users to freely navigate and interact with all parts of the website without needing a mouse.

Navigating the entire website using just the keyboard.

Designed to adapt smoothly across screen sizes, the website's layout remains clean and intuitive even on mobile devices.

Three screenshots side-by-side of the site's mobile layout.
Three examples of the responsive mobile layout.

The project prioritizes speed and stability, featuring carefully selected fallback fonts adjusted for size and spacing to minimize visual differences, along with proper image placement to prevent any layout shifts. The result is a fast, straightforward website that effectively showcases the artist's work and is consistent across devices.