본문 바로가기

가타부타

Neumorphism 과 그 적용

2012년 대선 패배의 충격을 이기지 못하고 블로그를 닫은지 거의 10년의 시간이 지났다.
내년에도 대선 패배의 충격으로 닫는 일이 없길 바라본다.

 

그동안 많은 일들이 있었고 나에게도 많은 변화가 있었는데

더 늙고 병들기 전에 놀쌈넷을 다시 시작해야겠다는 생각이 들었다.

물론 그런 생각이 든 시기도 몇년은 된거 같지만...

 

어쨌든 처음엔 아예 홈페이지를 따로 만들어볼까 생각도 했지만

짜투리시간에 만드는 건대

잘 알지도 못하는 부분까지 직접 챙겨서 만들면 다시 지쳐 나가떨어지고

또 한 십년은 묵힐거 같아서

기존의 블로그를 재단장해보는 걸로 가닥을 잡았다.

 

티스토리도 근 10년의 기간 동안 경동천지할 정도로 많이 바뀌어서

직접해볼수 있는 게 많아서 재밌게 작업할 수 있었다.

(티스토리에서 제공되는 가이드를 통해 거의 대부분의 요소가 커스텀이 가능하지만이 문서의 존재를 알게 된 시점이 이미 많은 작업의 진행이 많이 된 다음이었기에 )

소개 · GitBook

티스토리 스킨 가이드 티스토리에서는 스킨을 통해서 사이트를 자유롭게 디자인할 수 있습니다. 스킨은 치환자를 사용하여 제작되고 사용된 치환자에는 티스토리의 데이터가 대입되어 티스토

tistory.github.io

 

 

기존에 사용하던 스킨을 변경하는 수준에서 작업을 했지만

css 파트는 완전히 제로 베이스에서 시작했기 때문에 아마 인상은 많이 다를듯 싶다.

TISTORY

나를 표현하는 블로그를 만들어보세요.

www.tistory.com

 

원래 스킨의 예시 형태

 

 

서두가 길었는데 어쨌든 이번 블로그를 재단장하면서

어떻게 시각적인 구현을 할 것인가에 대해 고민하다가

번쩍하고 'Neumorphism' 이 생각났다.

('Neumorphism' 에 대한 내용은 아래 링크에서)

01화 뉴모피즘은 새로운 UI 트렌드가 될 수 있을까?

Do we really need Soft UI? | 최근 플랫/머티리얼* 디자인의 대안으로 떠오른 뉴모피즘에 관한 글이 자주 눈에 띈다. 돌아보면 모바일 인터페이스 디자인도 다양한 변화를 거쳐 현재에 이르렀다. iOS 초

brunch.co.kr

뉴모피즘이 새로운 트렌드가 되는 것에는 일단 실패한 것으로 보이지만

그럼에도 불구하고 이번 작업에 사용하게 된 이유는

1. 최소한의 리소스( 사실 박스 쉐도우를 제외하고 사용되는 스타일링에 관련된 코드들은 거의 없다시피함...)를 사용해서

시각적으로 심미감이 있는 디자인이 적용가능하고

2. 단점이기도 한 가시성이 부족한 부분이 오히려 컨텐츠를 부각하는 데에는 도움이 될 것이라는 판단이 들었으며(물론 그렇다고 블로그 컨텐츠가 좋을 거라는 말은 하지 않음)

3. 시바 예쁘지 않나??
정도로 정리가 되는거 같고

 

그렇게 해서 작업을 이어나가보니

약간의 오기? 같은게 생겨서 기본적인 css와 js를 제외하고

다른 리소스(이미지 등)는 하나도 쓰지 말고 만들어보자!! 라는

생각으로 간단한 아이콘이나 애니메이션 등도 전부 코드로만 작업해서 구현했다.

(슈로대 노강화파츠, 노육성으로 플레이하는 정신병 어디 안가지 ^오^)

 

업무시간에 짬내고 집에서 찔끔씩 하느라 작업기간은 길었지만 그래도

내맘에는 드는 결과가 나와서 기분이 좋은데

앞으로 뭘로 어떻게 채울지 생각하니까 또 정신이 혼미해지긴 한당.

 

본문 포스팅은 처음 하는건대 아마도 포스팅 부분을 좀 더 다듬으면 정말로 일단락되지 않을까 싶음.

 

  • 장케니 2021.03.05 01:25

    고생하셨슴다