사용자가 서비스를 처음 접하는 관문인 로그인 화면을 HTML과 CSS로 직접 디자인하고 마크업했다.
시각적인 안정감과 조작의 편의성을 최우선으로 고려하여 직관적인 사용자 인터페이스를 구축하는 데 주력했다.
CSS Flexbox 레이아웃을 사용하여 로그인 폼을 화면 중앙에 정교하게 배치하고 box-shadow 속성으로 입체감을 더해 시인성을 높였다.
입력 필드에는 placeholder를 적용해 사용자 가이드를 제공했으며 HTML5의 required 속성을 활용해 기본적인 데이터 유효성 검사 기능을 추가했다.
다양한 기기 환경을 고려하여 가변 너비를 설정함으로써 모바일에서도 레이아웃이 무너지지 않는 유연한 구조를 완성했다.
미세한 간격 조정과 색상 대비가 서비스의 신뢰도에 미치는 영향을 직접 확인하며 UI 설계의 중요성을 배웠다.
아름다운 디자인이 사용자의 몰입을 돕고 서비스의 전문성을 부각시킨다는 사실을 실제 구현 결과를 통해 깨달았다.
기능과 미학이 조화를 이루는 인터페이스를 완성하며 사용자 중심의 개발 사고를 강화했다.
정돈된 UI가 사용자에게 전달하는 무언의 신뢰를 다시 한번 확인하며 작업을 마쳤다.
