My 3D Porfolio Site

Hello everyone,

I present to you my site / portfolio with my works.
I work with 3d and Graphic Design.
My intention was to create a simple but clean site showing only the images.

I would like your opinion.

http://www.guilhermechagas.com

I really like the site, but even more I like the renders. You are a talented guy.

I think you should have a link to the contact information. Why no form?

Great job.

1 Like

Thank you very much!!

The initial idea was to have a form field, but I had a hard time configuring it. So I decided to launch the site before with three links, Facebook, MailTo and Linkedin and leave the form for an upcoming update.

Great site, fantastic renders. One tiny, tiny point the like and Facebook share icons at the very end are misaligned on my iPad (not tried on a full browser), only mentioned as everything else is as close to perfect as it is possible to get that these stand out.

1 Like

Thanks!! I will check that about the Facebook Like Button, because for me, on my iPad Air 2 this not happens

I haven’t used Blocs for a while, but my daughter is actually an animator for digital games and I’ll be developing a site for her soon.

Is it standard for Blocs sites to only load images now as the page scrolls down? I felt this was distracting to the overall impression and looking at the work. Apart from the image loading effect I liked it.

1 Like

As it is a purely image site, and even optimized, I was careful not to remove details, lowering the quality a lot. So I used a feature called “Lazy Load”, a .JS that makes the images load during scrolling to the page as the whole loads faster. I will study the possibility of lowering the threshold and the image load a little earlier.

1 Like

Great site and some very interesting images.

However, you have too much content for a single page “very long” site and I think the site and would work much better if you made it a multi page site. When viewing on some small devices and rotating the device from portrait to landscape and back, could trigger the breakpoints and cause long delays when the site collapses and suddenly gets 2 or 3 times longer.

1 Like

I tend to agree with @webdeersign that breaking the content into smaller pages based on subjects would be easier to manage on mobile devices.

On the question of lazy loading, I think this is great in theory. It’s just a question of finding the right balance, but this applies to all projects done in Blocs. Ideally I’d like to see content at the top of the page load instantly with no render blocking, before immediately starting to load other content further down the page. It shouldn’t just wait until you arrive at a location by scrolling before starting to load.

I don’t know if @Norm has any ideas how this can best be done in Blocs. I’ve even seen implementations in the past where low quality versions are loaded instantly with higher quality images fading in later, but this is rarely a good look. Allowing for retina just makes it that bit trickier.

1 Like

Hi. Can you explain how to create menu like this? I mean that animation from top.

1 Like

Thank you very much for the comment. From the beginning this question was a question for me … single page or multiple page. I will consider your idea for a future upgrade. I had been thinking of doing with the option to collapse each theme session with the Toogle Visibillity feature, but I was afraid of the performance on certain devices.

I really did not really like the Lazy Load feature, and I’m studying other alternatives, because when I did not use this feature, the 14MB page took 1 minute to load completely on a 2Mb internet (in Brazil it is common low speeds In broadband), and with the use of the page feature, at least the top of it, carries practically instantly

This animation is from the app. I used the first Bloc as Hero and the Stick menu.
I just made some size adjustments directly in the CSS generated in the export.

1 Like

14MB for a single page is huge. I would try to separate it into different pages and see if you can make the images lighter without losing quality.

1 Like

I agree with you. Do you have any suggestion to optimize? I have used the TinyPNG service. i believe the big problem is the amount of images in one page. So perhaps in another update i will change the layout.

Hey,

Your site looks great, especially the content! :slight_smile: I checked one of your images, and it looks like it optimized pretty ok, but the amount of images per page is way too much. Change the layout a bit and your site will be awesome!

1 Like

You could use multiple resolution so that larger files are only loaded for retina displays and individually lower the quality settings on each file in Photoshop save for web, until the visual quality starts to suffer. Less complex images can be compressed more without losing visual quality.

Make sure that the images are physically no bigger than you want them to appear on the page. If you want an image to be 600px wide on desktop it’s pointless uploading a bigger file, unless it’s for a retina display.

The biggest step though would be to create different sections on different pages, so you might have one section for ambient interiors and another for outdoor exteriors. That way each page would automatically be a lot smaller and faster loading.

Another trick would be to use CloudFlare and cache the images. That way if somebody in Paris wants to look at your site they will collect the images from a data centre in Paris, rather than from your host in Brazil, which will speed up the process. You can sign up for a free package and this should still help with the speed for many site visitors. They also have some clever speed settings in the options.

On a side note I checked one file and it was in Adobe RGB colour space, but if you convert it to sRGB the colours should appear better on most displays.

1 Like

It’s an afterthought, but it can be useful checking your site somewhere like Pingdom and then study the waterfall results that show how the page is loading. From that you can see if certain parts are causing delays, which often happens with callouts to Facebook etc.

1 Like

Thanks!! :smiley:

I’ll consider using the multiple resolutions feature. I did not use it, because I did almost all the site in an earlier version of Blocs, and now when it was finishing, I updated the program and this option came up, I just did not have time to update all the images.