처음부터 정교한 데이터 분석을 하려하기보다,무엇을 성공으로 볼지 정의하고 최소한의 로그와 관찰 체계를 만드는 것부터 시작해야함 1. 완벽한 지표말고 "판단 가능한 지표" 만들기기존 데이터가 없으면 정밀한 KPI를 세우기 어려움. 절대적으로 맞는 지표를 찾는게 아니라, 팀이 의사결정을 내릴 수 있는 지표를 먼저 정해야 함. 즉 성과 측정은 "우리가 잘하고 있는가?"를 거창하게 증명하는 것이 아니라 "어디서 막히는가?"를 찾는 것에 가까움 - 사용자가 가입은 하는데 핵심 기능까지 안 가는지- 문의는 오는데 결제로 안 이어지는지- 특정 기능은 자주 눌리는데 완료율이 낮은지- 프로젝트 생성은 하는데 다시 돌아오지 않는지 2. 성과 측정 기준은 3단계로 나눠야 한다.a) 선행지표결과가 나오기 전에 먼저 좋아져야..

다음 6개의 요소로 분류. 1. Product type- SaaS dashboard- B2B analytics dashboard- admin panel 2. Layout structure- left sidebar navigation- top navigation bar- card based layout- grid layout 3. Data visualization- line charts- bar charts- data tables- KPI widgets 4. Style- modern SaaS interface- minimal UI- glassmorphism- dark mode 5. Color system- emerald green accent- neutral background- soft shadow 6...

내가 보려고 정리하는 글. 요새 리서치나 디자인할 때 AI를 최대한 활용하려고 노력 중이다. 아래 표의 출처는 유튜버 알린님. AI 디자인 프레임워크 중 RTCCF(Role(역할), Task(작업), Context(상황), Constraint(제약 조건), Format(형식))라는 것이 있는데, 확실히 역할과 상황 설명을 해줬을 때 결과물이 좋았다. 내가 아닌 AI가 나의 업무를 맡는다면? 이라고 가정하고 돌려보는데, 100이면 100 나보다 잘한다..아무튼 AI 활용은 계속 살펴보아야 한다. 1목표 1문장 먼저"내가 원하는 결과는 OOO"부터 선언2출력 형식부터 고정표,목록,체크리스트,JSON, 모바일 UI, 데스크탑 UI, React code 등3제약조건 3개금지사항을 미리 적어 흔들림 방지4독자(..

- QHD에서 HD 만들 때 그대로 Scale 50%하면 안됨 [적용 공식]1. 폭 관련 값은 절반2. 텍스트/버튼은 절반보다 20%~30% 크게 유지3. 세로 간격은 절반과 동일하게 줄이지 않는다.(0.6~0.7)

URL : https://developedbyssony.github.io/enterpriseBlockchain/ 컨텐츠 영역에 섹션이 16개 들어갔으며, 중간에 div로 묶어준 section에 data-theme="dark"를 적용하였다. 또, .sc_service 섹션 같은 경우 인터랙션에 용이하기 위해 내부에 수직 컨텐츠와 수평 컨텐츠를 따로 묶어주었다. 클론을 하면서 GSAP을 활용한 스크롤 인터랙션을 구사하는 것에 중점을 두었다. 본 포스팅에서 스크롤 인터랙션 시나리오를 간단하게 정리하고자 한다. 일단 GSAP 활용하기 위해 CDN을 넣어야한다. 스크롤 인터랙션을 구현하기 위하여 스크롤 트리거용 CDN도 넣어준다. a. 인트로 구간 const motionIntro = gsap.timeli..

URL : https://developedbyssony.github.io/cellSafe/ 셀세이프PCR 제품 Customization 기성제품의 한계를 넘어 고객이 원하는 용도에 적합한 커스터마이징 제품을 공급합니다.developedbyssony.github.io header, main, footer로 구분되는 간단한 HTML 구조에 미디어쿼리는 1200px를 기점으로 PC와 Mobile에 대응하는 웹사이트이다. 클론을 하면서 간단한 코드로 효과적인 인터랙션을 만드는 것에 중점을 두었다. jQuery를 사용하였으며 1)인터랙티브 헤더, 2)메인 슬라이드(swiper 슬라이드 라이브러리 사용), 3)간단한 모션을 중점으로 문서를 정리하였다. 1) 헤더 - 상위 메뉴 호버// .depth01 요소에 ..