본문 바로가기

전체 글

(17)
[UX 디자인] 미소 파트너 (가사도우미편) 최근 눈여겨보던 O2O플랫폼 중 하나인 가사도우미 중개 플랫폼 '미소 파트너'를 이용해 초단기 알바를 해보았습니다. 미소는 가사도움을 필요로 하는 고객이 '미소'앱으로 서비스를 신청하면 해당 일을 하기 원하는 클리너가 '미소 파트너'앱을 통해 신청해 일을 하고 임금을 받을 수 있는 구조의 중개 서비스입니다. 내가 원하는 날짜, 시간, 장소라면 자유롭게 신청할 수 있지만 파트너 등록, 일자리 지원은 30~70세 여성만 가능하다는 제약조건이 있습니다. 이 글은 서비스 제공자, 즉 가사도우미로서 앱을 이용해 보며 알게 된 내용을 다루고 있습니다. (의뢰자가 이용하는 '미소'앱은 청소가 아닌 다른 목적으로 써볼 기회가 있을 것 같습니다.) 여정 1. 미소 파트너 지원 저의 경우 알바몬 사이트에서 알바 정보를 보..
[HTML/CSS] 서울대공원 키즈 사이트 최근에 HTML과 CSS 지식을 업데이트할 기회가 생겨 연습 겸 간단한 디자인과 웹 퍼블리싱 작업을 해보았다. grid 속성과 같은 최신? 문법을 사용해 보니 CSS도 다른 기술 못지않게 많이 발전했다는 생각이 들었다. 예전이라면 복잡하게 작성했을 레이아웃들이 너무 간단하게 구현된다.. 종종 관심 가는 사이트가 생길 때 시간을 내서 소스를 까봐야겠다. 호스팅 URL : https://injin.github.io/css-practice/grandpark-seoul/main.html 소스 코드 : https://github.com/injin/css-practice/blob/main/grandpark-seoul/main.html 그리고 이김에, 중요하다고 생각하거나 까먹기 쉬운 HTML, CSS 지식을 별도로..
[HTML/CSS] 중요 지식 정리 지극히 주관적인 중요 지식. 뭐든 오래 쓰지 않으면 까먹기 쉬우니 종종 찾아보자. 1. HTML 1.1 HTML 구조 의 의미 현재 버전을 알려주는 것. 현재의 문서가 HTML5임을 나타냄 HTML4, HTML5 문법 비교 1.2 해상도 PC 해상도에 따라 요소의 크기가 결정됨 PC 해상도가 1920인데 이미지가 960px이면 화면의 절반의 차지. 해상도는 쉽게 말하면 한 화면에 몇 개의 점이 찍히는가임. 같은 해상도라도 모니터의 크기가 다를 수 있음 1px의 실제 크기는 PPI (Pixel Per Inch)에 따라 달라짐. 웹&모바일은 72ppi 안드로이드 사이즈 단위 DP, iOS에서 사이즈 단위 PT 이미지를 원래 크기보다 크게 키우면 픽셀 사이사이를 벌려서 평균값으로 채움 웹기획에서 PC화면 크기..
[UX 디자인] 정독 도서관 제가 좋아하는 장소 중 한 곳인 정독 도서관을 UX관점으로 분석해 보았습니다. 우선 서가에 도착하기까지의 여정을 소개해야 될 것 같아요. 1. 도보 이동 버스를 타고 창덕궁 정류장에 내리면 정원에 앉아서 먹을 커피와 간식(보통은 와플)을 사서 도서관으로 걸어갑니다. 어떠한 경로로 가던 북촌을 경유하기에 관광객을 쉽게 마주칠 수 있고 만약 평일 점심시간에 지나가게 된다면 회사원 인파가 더해져 낯섦의 정도가 완전히 다른 사람들이 섞여 걷는 오묘한 경험을 하게 됩니다. 오밀조밀한 가게들을 구경하며 걷다가 웨이팅이 많기로 유명한 런던베이글 매장을 지나고 조금 더 걸으면 어느새 도서관 정문에 도착합니다. 2. 정원 이곳에서 제가 제일 좋아하는 공간이기도 한 이곳은 넓은 잔디밭에 가운데 분수가 있는 구조로 마치 중..
[단어 일기장] UI/UX 분석 이 서비스에 대한 기능적인 고민을 할수록 생각이 정리되지 않은 느낌을 받았는데 최근 UI/UX 쪽 지식을 접하면서 그 문제의 원인에 대해 생각해 보게 되었다. 퍼소나의 부재 어떤 사람들이 이 서비스를 써야 될까? 명상을 하는 사람들? 긴 텍스트의 일기를 쓰는 것에 부담을 느끼는 사람들? 어느 대상이든 퍼소나는 구체적이고 명확해야 한다. 퍼소나가 분명해야 UX 전략 (Function, UX Writing, UI Design)을 설계할 수 있다. 타게팅 대상이 없으니 카테고리가 흔들리고, 기능을 확장하는 과정에서 자연스레 일관성이 떨어진다. 디자인 프로세스 그렇다면 어떤 과정이 있었다면 좋았을까. 가장 잘 알려진 프로세스로 더블 다이아몬드가 있다. 총기간을 4등분 해서 발산과 수렴을 반복하여 탐색과 구현을 ..
[단어 일기장] 이메일 인증기능 개발 : Amazon SES 오래된 계획이었던 이메일 인증기능 개발을 드디어 완료하여 그 과정을 간단히 정리했다. 1. 요약 사용자는 하루에 한 번 가입을 시도할 수 있다. 즉, 가입 인증 메일이 한 번만 발송된다. 만약 같은 이메일로 여러 번 시도한다면 가입 화면에 ‘(이미 이메일이 발송되었으니) 이메일 인증을 완료하라’는 안내 문구를 출력한다. 메일의 내용에는 인증을 완료할 수 있는 링크를 포함하고 클릭 시 회원 가입 처리가 완료된다. 자정이 되면 PENDING 상태의 회원 데이터를 CANCELD로 일괄 변경하는 배치를 수행하여 다음 날 사용자가 가입을 재시도할 수 있게 한다. (이 부분 아직 미개발) 2. SES 구성 Amazon SES에서 이메일을 전송할 때 사용할 도메인을 등록하였다. 그리고 테스트를 위해 개인 이메일도 추..
[단어 일기장] 오픈 인프라 구조가 조금씩 바뀔 것 같아 깃헙에 있던 최초의 배포 과정을 따로 이곳에 포스팅하게 됐다. Private Subnet 내의 위치한 EC2 서버 접근은 우선 putty로 SSH 접속하였지만 AWS SSM을 이용한 더 안전한 방식이 있어 나중에 따로 정리해볼 계획. 1. 배포 1.1 배포 과정 jar 빌드 ./gradlew clean build /build/libs 하위 경로에 jar 파일 생성됨 VPC 리소스 사전 구성 (ElasticBeanstalk구성 시 기본 VPC 사용하지 않게 하기 위함) VPC ⇒ IGW ⇒ Subnet ⇒ RoutingTable 순으로 생성하였음 키페어 생성 ElasticBeanstalk(이하 EB) 애플리케이션, 환경 구성 사용자 지정 옵션을 선택하여 앞서 구성한 VP..
[단어 일기장] 제작 의도 공백기를 보내면서 요가원을 다니기 시작했다. 이국적인 인센스 스틱향, 자주 가는 식당, 카페, 도서관 어디에서도 듣지 못했던 잔잔한 음악, 뻣뻣한 나의 몸. 그 어느 것보다 친해지기 어려웠던 것은 다름 아닌 명상이었다. 강사님 말씀으로는 지금 떠오르는 생각을 알아차리고 흘려보내라는데 중구난방 흐르는 생각들을 흘러 보낸다는 것은 어떤 느낌인지 매번 알쏭달쏭했던 것 같다. 그런데 시간이 좀 흐르고 보니 이제는 적어도 그 중요성 만큼은 알 것만 같다. 객관성을 가지고 현재에 집중하는 것이 좀 더 자기를 사랑하는 방식임을. 그런 의미에서 매일의 생각을 알아차리게 도와줄 수 있는 MRI 같은 도구를 만들게 되었다. 아직은 작은 서비스지만 짬짬이 개선하고 과정을 기록할 계획이고 나중에는 여러 기능을 추가해 봐야겠다..