웹사이트의 변화 과정을 기록했어요.

2025년 7월 11일

2025년 7월 11일

2025년 7월 업데이트 기록

2025년 7월 업데이트 기록

-폰트, 컬러 시스템 등 최근 변경한 디자인 시스템의 일관성을 개선했습니다.
-내비게이션 버튼의 디자인을 수정했습니다.

-기록 페이지 데스크탑 뷰에서의 콘텐츠 배열을 기존 3열에서 4열로 변경해 더 많은 콘텐츠를 한 화면에 담았습니다.

-데스크탑 뷰에서의 컨테이너 최대 크기를 줄여 가독성을 향상시켰습니다.

-기존 원 형태의 마우스 커서 디자인은 중심점이 불분명하다는 단점이 있었습니다. 어디를 가리키고 있는지 명확성을 향상시키기 위해 뾰족한 형태로 커서 디자인을 변경했습니다.

-홈 페이지의 배경사진을 변경했습니다.

-소개 페이지의 콘텐츠를 더 다양화하고, 디자인 테마에 맞게 수정 중입니다.

-프로젝트 페이지의 슬라이드 쇼에 이전 및 다음 슬라이드로 넘길 수 있는 버튼을 추가했습니다.

2025년 6월 13일

2025년 6월 13일

2025년 6월 업데이트 기록

2025년 6월 업데이트 기록

-모든 페이지의 내비게이션 바를 리디자인했습니다.
-모바일의 경우 가독성 향상을 위해 기존 메뉴가 펼쳐져있던 방식에서 메뉴 버튼을 눌러 이동하는 방식으로 변경했습니다.
이로 인해 단계가 하나 추가되었지만 가독성 향상이 주는 이점이 더 크다고 생각하여 변경하게 되었습니다.

-버튼, 폰트, 컬러를 보다 사용자 친화적으로 변경 중에 있습니다.
6월 중으로 디자인시스템이 확립될 예정입니다.
현재 1차적으로 디자인시스템을 변경했습니다.

-마우스 커서의 꼬리 기능을 삭제했습니다.
꼬리 기능이 방문자의 사용성을 해친다고 판단했습니다.

-화면 테마 토글과 화면 테마 변경 기능을 삭제했습니다.
이후 진행될 업데이트로 인해 내비게이션 바와의 합이 맞지 않는다고 판단했습니다.

-새롭게 확립 중인 디자인시스템을 적용해 일부 요소의 디자인이 변경되었습니다.
변경 요소 : 버튼, 피드백 폼, 프라이머리 컬러 적용

-메인 페이지의 히어로 섹션 디자인을 변경했습니다.

-피드백 드래그 캐러셀 영역의 디자인을 개선했습니다.

-디자이너로서의 전문성을 강조하기 위해 프로젝트 페이지 한정으로 다크모드를 디폴트로 설정했습니다.

-데스크탑 뷰에서 기존 프로젝트 카드의 최대 3열 배치를 4열 배치로 변경했습니다.
-데스크탑 뷰에서 기존 프로젝트 카드의 최대 2열 배치를 3열 배치로 변경했습니다.
-모바일 뷰에서 기존 프로젝트 카드의 최대 1열 배치를 2열 배치로 변경했습니다.

-화면의 상단에 핵심 프로젝트 3가지를 보여주는 슬라이드 쇼를 추가했습니다.
슬라이드 쇼의 인디케이터를 통해 5초 간격으로 바뀌는 프로젝트 배너를 확인할 수 있으며,
직접 클릭하여 다른 프로젝트 배너를 확인할 수 있습니다.
보러가기 버튼을 클릭해 해당 프로젝트를 감상할 수 있으며,
좋아요 버튼을 눌러 해당 프로젝트를 평가할 수 있습니다.

-프로젝트의 카테고리를 스크롤 시에도 누를 수 있게끔 스크롤 시 상단에 고정하는 방식으로 개선했습니다.

-프로젝트 카드의 텍스트 및 카테고리 배치를 기존 좌측 정렬에서 가운데 정렬로 변경하고 크기를 줄였습니다.

2025년 5월 5일

2025년 5월 5일

2025년 5월 업데이트 기록

2025년 5월 업데이트 기록

-메인 페이지의 타이틀(SEJUNKI)과 내비게이션 바의 메뉴명(ABOUT, PROJECT, KI-LOG)을 강조하기 위해 모든 페이지의 소개 타이틀을 기존 영문에서 한글로 변경했습니다.

-방문자가 직접 기록할 수 있는 폼 기능을 추가했습니다.
전송된 내용은 빠르게 검토 후 해당 섹션에 반영됩니다.
부적절한 내용이 포함된 경우 제외될 수 있습니다.

-피드백 섹션으로 명칭을 변경했습니다.(05.22추가)

-홈 페이지의 소개 섹션 디자인을 디벨롭했습니다.
자의 눈금을 활용한 디자인으로 기능과 미학의 균형감을 표현하고자 했습니다.
기존의 일반적인 인사말 대신 저를 상징할 수 있는 문구로 변경했습니다.

-홈 페이지의 프로젝트, 프로젝트 관람 및 사용자 기록, 기록, 컨택 섹션의 가로 최대 너비값을 수정했습니다.
내용이 조금 더 눈에 잘 들어오게끔 가로 최대 너비를 수정했습니다.

-컨택 섹션의 버튼 디자인을 디벨롭했습니다.
연락 수단을 강조하기 위해 버튼의 디자인을 변경하고 정사각형의 크기를 최대한 키워 배치했습니다.

-새벽에 공개된 프레이머의 새로운 기능을 발빠르게 적용해 로직을 변경하고 로고 애니메이션을 최적화했습니다.

-로고의 크기를 기존에 비해 작게 변경했습니다.
버튼의 영역은 그대로 유지됩니다.

-소개 페이지의 히어로 및 푸터 섹션을 제외한 콘텐츠의 가로 최대 너비값을 수정했습니다.
내용이 조금 더 눈에 잘 들어오게끔 가로 최대 너비를 수정했습니다.

프로젝트 상세 페이지에 이어 기록 상세 페이지에도 좋아요와 조회수 기능이 추가되었습니다.

2025년 4월 9일

2025년 4월 9일

2025년 4월 업데이트 기록

2025년 4월 업데이트 기록

-마우스 커서를 따라오는 선 효과를 추가하여 심미성과 가독성을 향상시켰습니다.

-404페이지 리디자인이 진행되었습니다.
-404페이지에서 7초 뒤 메인페이지로 이동하는 기능을 추가했습니다.

-프로젝트, 기록 페이지의 칩 디자인 및 배치를 수정했습니다.

-리디자인한 푸터를 한 차례 더 수정했습니다.
라이트, 다크모드에서 컨텐츠와 구분되는 어두운 배경 컬러를 사용했으며
버튼들의 컬러도 조절해 가독성을 향상시켰습니다.

-기록 상세페이지를 현재 디자인 테마에 맞게 수정했습니다.

-메인페이지를 리디자인했습니다.
스크롤하여 각 페이지의 개요를 살펴볼 수 있으며 다른 페이지와의 디자인 일관성을 유지 및 디벨롭했습니다.
-프로젝트 관람 및 사용자 평가를 확인할 수 있는 섹션을 추가했습니다.

2025년 2월 8일

2025년 2월 8일

2025년 3월 업데이트 기록

2025년 3월 업데이트 기록

-체계적인 디자인시스템을 구축하기 위해 컬러시스템을 재정비했습니다.
-드래그할 수 있는 일부 요소(텍스트 등)에 드래그 시 컬러값을 브라우저 기본 값 대신 제가 설정한 컬러시스템의 컬러로 적용되도록 변경했습니다.

-네비게이션 바의 터치 영역을 개선하여 조금 더 쉽게 메뉴를 오갈 수 있습니다.
-화면 테마 토글을 부활시켜 사용자의 기기 화면 테마에 따른 모드를 적용할 수 있습니다.

-프로젝트를 감상할 때 액션바를 통해 원하는 액션을 바로바로 취할 수 있게 개선했습니다.
-기록을 읽을 때 액션바를 통해 원하는 액션을 바로바로 취할 수 있게 개선했습니다.

-기존의 블로그 메인 및 상세 페이지를 기록 페이지로 1차 리디자인했습니다.
-목차 카드를 통해 글의 내용을 빠르게 찾아볼 수 있습니다
-폰트 시스템을 확립하여 가독성을 향상시켰습니다.

-사파리 브라우저에서의 페이지 전환 시 더 매끄러워보이게 모든 페이지의 전환 효과와 텍스트 애니메이션을 수정했습니다.

-소개 페이지의 1차 리디자인이 진행되었습니다.
추후 구성요소 추가 및 디테일 수정이 두 차례에 걸쳐 진행될 예정입니다.
-소개 페이지의 2차 리디자인이 진행되었습니다.(03.22추가)
내용을 추가하고 레이아웃을 재구성했습니다.

-프로젝트 페이지에서의 프레임 드랍문제가 사파리 브라우저에서 특히 심하게 나타나 원인을 분석하고 코드를 최적화하여 문제를 해결했습니다.

-프로젝트 상세 페이지 로드 시 구성요소들마다 나타남 효과가 적용됩니다.

-기존 좋아요 버튼은 IP주소로 사용자를 구분하여 좋아요 여부를 판단하다보니 같은 와이파이를 사용중인 기기 간에 동일한 좋아요 상태를 유지하는 현상이 발생했습니다.
이번 업데이트를 통해 새롭게 로직을 바꾼 좋아요 버튼은 브라우저 로컬 스토리지와 쿠키를 활용해 사용자를 더 명확하게 구분합니다.

-그 밖에 텍스트 수정 등 자잘한 부분을 수정했습니다.
-웹사이트에 설정한 버튼 클릭시, 클릭하고 있음을 인지할 수 있는 제가 설정한 그레이톤의 버튼 배경 컬러 외에 각 브라우저의 기본 값과 중첩되어 의도한 것보다 더 진한 버튼 배경 컬러로 보이는 현상을 제가 설정한 효과만 적용되도록 하여 해결했습니다.(03.22추가)
-가독성 향상을 위해 선택된 칩 컬러를 변경했습니다.(03.22추가)

2025년 2월 8일

2025년 2월 8일

2025년 2월 업데이트 기록

2025년 2월 업데이트 기록

-기존의 뒤로가기 버튼은 클릭 시 블로그 리스트 페이지로 이동했습니다.
이를 개선하여 이제 뒤로가기 버튼 클릭 시 직전 페이지로 이동하게 됩니다.
-호버 및 누름 효과가 적용됩니다.

-웹사이트에 적용된 모든 폰트를 가변형 폰트로 변경했습니다.

-이제 프로젝트 별 조회수를 확인할 수 있습니다.
조회수는 프로젝트 상세 페이지에 접속한 기기당 1시간 단위로 카운트 됩니다.

-프로젝트 리스트 카테고리 칩 디자인을 새롭게 리뉴얼 중인
웹사이트 디자인 테마에 맞게 변경했습니다.
-프로젝트마다 한 개의 카테고리를 가지고 있었습니다.
해당되는 카테고리가 많을 경우에도 한 개의 카테고리에만
포함될 수 있던 기능을 디벨롭시켜 한 개의 프로젝트에
여러개의 카테고리를 포함할 수 있도록 했습니다.

-프로젝트 페이지 내 프로젝트 카드의 그라디언트 효과를
각각의 프로젝트에 어울리는 컬러로 변경했습니다.
-프로젝트 카드 호버 시 효과를 주어 흥미를 유도하고자 했습니다.
-프로젝트 카드 썸네일을 더 나은 썸네일로 변경했습니다.

-프로젝트 상세 페이지를 새롭게 디자인했습니다.
이제 각 프로젝트에 어울리는 배경 컬러가 적용되며,
데스크탑에서 관람 시 이미지에 최대 너비 제한을 두어
몰입감을 높일 수 있도록 했습니다.
-더불어 댓글 기능을 다시 이용할 수 있게 됩니다.
-작품마다 카운트되는 좋아요 버튼을 새로 추가했습니다.
-작품마다 카운트되는 조회수 기능을 새로 추가했습니다.

-네비게이션 바의 디자인을 차기 웹사이트 디자인 테마에 어울리게끔 변경했습니다.
-모든 페이지에서의 네비게이션 바 가시성을 향상시켰습니다.

-프로젝트 페이지, 블로그 페이지 새로고침시 강제로 스크롤되는 현상을 수정했습니다.
-그 밖에 텍스트 수정 등 자잘한 부분을 수정했습니다.

2025년 1월 25일

2025년 1월 25일

2025년 1월 업데이트 기록

2025년 1월 업데이트 기록

기존의 버튼에서 현재 웹사이트의 디자인 테마에 맞게
버튼 디자인을 디벨롭했습니다.

그 밖에 텍스트 수정 등 자잘한 부분을 수정했습니다.

2024년 9월 1일

2024년 9월 1일

2024년 8월 업데이트 기록

2024년 8월 업데이트 기록

기존 3차 리뉴얼 디자인을 어느정도 유지하면서 원하는 무드를 표현하고자 했습니다.
현재 페이지 디자인이 확정은 아니며 지속적으로 더 나은 방향으로 수정해나갈 예정입니다.

프로젝트 상세 페이지에 상단 이동 버튼을 추가하여 언제든 페이지 상단으로 이동할 수 있습니다.

드디어 코멘트 기능이 추가되었습니다.
사용자 이름과 글 내용을 작성하여 저에게 코멘트를 남길 수 있습니다.
단, 악플은 신고 대상이 될 수 있습니다.

홈에서 웹사이트 총 방문자 수를 조회할 수 있습니다.
새로고침해도 바로 카운트되지 않으며 1시간 단위로 카운트됩니다.

서울의 현재 기온을 확인할 수 있는 소소한 기능을 추가해보았습니다.

버튼을 눌러도 페이지가 이동하지 않는 문제를 해결했습니다.

2024년 7월 14일

2024년 7월 14일

2024년 7월 업데이트 기록

2024년 7월 업데이트 기록

기존 블랙 배경에 화이트 로고였던 파비콘을 변경하였습니다.


카카오톡 등에 링크 공유시 나타나는 이미지 썸네일을 변경하였습니다.

블러의 최적화 이슈로 페이지 진입 시 상당한 렉이 동반되었었습니다.
문제를 해결하기 위해 프로젝트 리스트를 구성하는 카드 디자인을 변경하였습니다.
또, 제목 밑에 작품개요 대신 부제목을 배치하여 복잡함을 최소화하였습니다.

2024년 2월 17일

2024년 2월 17일

2024년 2월 둘째주 업데이트 기록

2024년 2월 둘째주 업데이트 기록

원하는 카테고리만 골라 볼 수 있게 카테고리 구분 기능을 추가하였습니다.

메인 페이지 프로젝트 섹션에 각 프로젝트의 썸네일을 노출시켜 바로 접근할 수 있게 하였습니다.