원페이지 홈페이지 제작을 위해 찍었던 사진들.

 

프론트엔드를 하고 있지만, 가끔 원페이지 같은 비교적 간단한 홈페이지를 만들 때는 웹디자인도 해야 할 때가 있다. 이 사진들도 그 작업을 위해 찍었던 사진들.

 

디자인은 대충 하면서도 무조건 빨리 제작해야 할 때는 아무래도 사진이 낫다. 대충 이것저것 찍어서 크롭하고, 비현실적인 필터 입혀서 딱 붙이면 그럴듯 하게 보이니까. 그림 사이에 단순하고 간단한 사진이 약간 섞여 있으면 강조가 되기도 하고.

 

여하튼 찍었으니 올리는 사진들. 크롭을 위해서 찍었기 때문에 전체적인 구도 따위 신경쓰지 않는다.

 

 

 

 

 

여기 올리는 것은 사진을 그대로 올리는 거지만, 홈페이지 디자인에 쓸 때는 인스타그램 같은 데서 보이는 수많은 필터들을 골라서 입힌다. 컨셉에 따라 아예 그림 처럼 바꾸기도 하고, 뿌옇게만 해서 사진 그대로 쓰기도 하고. 뭐 그까이꺼 대강. 참 쉽죠.

 

 

 

 

 

다른 상품 사진은 당연히 사용하면 안 된다. 하지만 까만색 책이라는 것만 느낄 수 있게끔, 크롭을 잘 하면 전혀 어떤 상품인지 알 수 없는 책 이미지만 얻을 수도 있다. 하기 나름.

 

 

 

 

 

이건 헤더나 푸터, 혹은 배경 이미지 용. 거의 패턴 비슷해 보이면서도 완전한 패턴은 아니라서 살짝 다른 느낌을 줄 수도 있다. 물론 너무 넓게 들어가서 용량을 많이 차지한다면 패턴을 사용하는 쪽으로.

 

 

 

 

 

 

가끔 자주 프론트엔드 분야에서 퍼포먼스를 말 하려는 사람들이 있다. 프레임웍 사용하면서 제이쿼리 같은 걸 쓰면서 그런 말을 하면, 좀 웃기는 일이다. 한참 양보해서 제이쿼리 까지는 그렇다 치자. 이런저런 프레임웍을 사용하면서 프론트엔드에서 퍼포먼스 최적화 운운한다면, 뭔가 잘 모르는 초짜이거나, 옛날 지식을 업데이트 하지 못 한 오래된 사람이거나, 혹은 그냥 니가 싫다고 말 하는 것 뿐이다.

 

물론 리소스가 무한대인 것 처럼 아무 생각 없이 만드는 것도 안 되지만, 프론트엔드에선 불편하지 않은 정도의 속도만 나와준다면, 백엔드 처럼 0.1초 단위로 성능 개선에 집착할 필요는 없다. 그것보다 중요한 것들이 더 많기 때문이다.

 

 

프론트엔드 개발에서 중요한 것은, 빠르게, 정확하게, 견고하게 만드는 것이다. 기획이나 디자인, 백엔드도 어느 정도 비슷하기는 하지만, 특히 프론트엔드는 빠르게 만드는 것이 중요하다. 뼈대를 빠르게 쳐 내고, 디자인을 뭔가 만져볼 수 있게끔 한 다음에, 그 후에 상세한 기능과 데코레이션과 성능 개선으로 들어가야 하는데, 주니어들이 이걸 잘 못 한다. 작업을 순서대로 쭉 하다보면 데코레이션에서 막힐 때가 있는데, 개발자 특유의 집념으로 이걸 물고 늘어져서 시간을 끄는 경우가 종종 있기 때문. 이런 습관은 프론트엔드 작업에선 버려야 한다.

 

그리고 정확하게는 디자인을 정확하게 옮기는 것. 브라우저마다 약간씩 틀어지는 것은 어쩔 수 없다 치더라도, 정확히 옮겨 주는게 중요하다. 때에 따라 이 정확성은 넘어온 디자인을 1픽셀의 오차도 없이 만드는 것이 아니라, 디자이너의 의도를 파악해서 어느 정도 유동성을 가져야 할 때도 있다.

 

그리고 견고하게는 최대한 브라우저나 모니터 사이즈, 혹은 기기 등의 특성에 상관없이 보이도록 하는 것이다. 이 부분을 해결하려고 나온 것이 반응형인데, 이게 만드는게 좀 골치 아픈 부분이 많아서 슬슬 좀 다른 걸 모색해봐야 하지 않나 싶다. 요즘은 아예 PC는 포기하고, 모바일 화면으로만 가는 경우도 많다. 어차피 그렇게 해도 PC에서도 보이긴 보이니까.

 

어쨌든 다들 알다시피, 이것도 그냥 그렇다는 이야기일 뿐, 어떤 상사나 사장, 클라이언트를 만나느냐에 따라 모든게 달라진다. 어쩔 수 없지, 자본주의다! 쓸 데 없는 말이 너무 길어졌다.

 

 

 

 

 

 

홈페이지, 특히 원페이지 용 사진은, 장식으로 사용되는 것이라면 화질도 그리 중요하지 않다. 어차피 데코레이션으로 사용되는 거고, 웹 화질이 딱히 좋은 것도 아니니까. 사람들이 홈페이지를 들어가는 이유는 정보를 얻기 위함이지, 사진을 보기 위함이 아니다. 물론 광고, 홍보용 사진이라면 말이 다르지만.

 

 

 

 

 

길거리에서 찍기도 하지만 아무래도 좀 이미지가 지저분하다. 이래저래 소품 용으로 쓰기 좋은 사진을 얻으려면 아무래도 소품 샵이 좋다.

 

 

 

 

 

 

이번 사진에는 나오지 않지만, 정말 시간이 없거나 귀찮을 때는 다이소를 가기도 한다. 거기도 나름 사진으로 찍어놓으면 대충 쓸만 한 것들이 나올 때가 있다. 물론 사진은 모두 핸드폰으로 찍는다. 여기 있는 사진들도 모두 폰카로 찍은 것들이다. 크롭 할 용도라서 일부러 와이드로 찍었다.

 

 

 

 

 

 

 

 

 

 

 

 

뭔가 아기자기한 소품들이 많은 샵에 들어가면 물건을 구경하는 재미도 있지만, 사진을 찍는 재미도 있다. 굳이 어떤 용도로 쓸 것이 아니더라도, 찍어와서 구경하고, 다시 또 가서 찍어보고 또 구경하고 하다보면, 뭐 별로 남는 건 없겠지만, 나름 재미가 있다. 실내라도, 똑같은 물건이라도, 날씨에 따라, 계절에 따라 다른 이미지가 찍히는 것을 알면 조금 더 흥미로워진다.

 

 

 

 

 

 

 

 

대략 이러했다. 먹고 살려고 오만 짓을 다 했다는 이야기. 간단한 템플릿을 이용한 원페이지 홈페이지 만들어 드림. 가격은 비쌈. 끝.

 

Posted by 빈꿈