와이어프레임 2

html+css를 이용한 러프한 화면 구획 (서울시 유치원 정보 사이트 프로젝트 ep.1)

지난주에 와이어프레임으로 구성해본 기획안을 간단하게 html+css를 통해 화면 구획을 진행해보았다. 내 본업이 디자이너이긴 하지만 나의 개발 프로젝트들의 경우 개발 능력 향상과 기능 구현에 좀 더 큰 목적을 두고 있기 때문에 먼저 이런식으로 html+css로 러프하게 구획 설정으로 대략적인 구조를 잡고 기능 기발을 진행한 후에 그에 맞는 ui 디자인을 하는게 훨씬 더 효율적이었다. (아직 초보이다보니 디자인 열심히 다듬어놓고 기능구현이 안되면 다시 갈아엎어야 하기에…ㅜㅜ)   화면 구획은 css의 flex로 거의 진행하는 편이다. 반응형 디자인이나 간격조정에 가장 효과적이기 때문이다. (뭔가 div로 계속 감싸줘야한다는 단점은 있는듯하다;)div class="detail-basic"> div class..

프로젝트 기획 및 R&D 예상물 산출 (서울시 유치원 정보 사이트 프로젝트 ep.0)

웹컴포넌트 활용 테스트를 마치고 본 프로젝트인 '서울시 유치원 정보 사이트 프로젝트'에 착수하려고한다. 기획에 앞서 혹시 내가 해보려고하는 유치원 정보 조회 사이트가 있는지 검색해보았는데 역시나 있었다... 이 방대한 api 자료를 가지고도 그걸 활용한 사이트가 없는게 이상하다고 생각되긴 했다만;; 내가 최초를 못찍었다는 부분에서 좀 아쉽긴 했다. 더군다나 거의 같은 api 정보를 활용해서 만들어서 그런지 내가 구상했던 사이트 구조와 거의 일치했다 ㅜㅜ  이런 부분들이 아쉽긴 했지만 그래도 만들어보는게 의미있다고 판단해서 실행해보기로 했다. 어차피 지금 제작의 목적은 반짝이는 기획력을 보여주려는 목적이라기보단 나의 개발력을 향상하려는 목적이 가장 크기 때문에 유사한 사이트가 하나 더 나온다고해서 크게 문..