Ruccula
Photography page of hectorcort.es
- 8 Dec 2021
- ⌘
- 3 min read
When I first decided to create my own photography portfolio, quite a few doubts came to my mind. Even if I had numerous ideas, it didn’t seem easy to select the most appropriate ones. Therefore, before starting to work on my own project, I thought it might be useful to have a look at some examples of portfolios available on the Web. Unfortunately, the more samples I analyzed, the more confused I felt. Some take a minimalist approach,like an Instagram, others look like Flickr with more irregular grids, and a few use a more magazine unique look. Even if I found some nice aspects in most of them, none of them fulfilled my expectations. Rather than feeling disappointed, I understood that I had a breathtaking challenge ahead.
Despite all that bewilderment, as the saying goes, every cloud has a silver lining. Thank God or some other divinity, I saw a light coming from far away, specifically from the Netherlands, where there is a photography magazine called Foam, which has an online page section called Talents. This section includes works of countless photographers from around the globe. Thus, we can examine how they display their works, the horizontal layout, the color palette, the color changes with various photographs, the use of emojis as like buttons, etc. All these unique features totally blew my mind. It was then that I started ideating my page.
1. How
The shadow of the emoji Not long before I began building my Photography Page, I discovered a really funny way of getting an emoji-filled outline only with CSS, which, coincidentally is the same way the programmers in the movie Free Guy discovered that their code had been stolen: the main object had been hidden, but its shadow remained. Given that emojis are displayed like text, in theory, they can be “colored”. Nevertheless, in practice, you can color only their shadow. Anyway, you can not only fill them but also somehow change their color. Well, this is the technique I use in the emojis displayed in the photography text. Note that the real emoji will appear only when you hover your cursor over it.
Having a horizontal scrolling page gave me some headaches: I had to work on solving issues related to that for five days, instead of the two days I had originally planned. My purpose was that when you scroll from one image to the next, the background, the text and the border colors change. I wish every photo to have its own color palette. The big problem of doing this is that it is not a conventional horizontal scrolling page. (The usual mode is scrolling from left to right, which is impossible with conventional mouses and trackpads.) Therefore, the calculations from the viewport frame to the elements on the page become more complicated.
color sections
I have a to-do list for this section, including adding a different enter effect with every topic, and multi-emoji-like buttons in every page, which can count and display how many times they have been clicked.
2. What
As far as my Photography Page is concerned, I decided to construct a subpage devoted to each different topic, with its own idiosyncrasy and vibe with respect to color palettes and tones: some tell a story, others are rather serious, yet others are funkier. To begin with, I am including three topics. In the next months I will be adding some more topics.