체지방을 측정하고 싶었는데 100개 이상의 계산기를 만들게 되었습니다

원래 계획은 한심하게 간단했습니다. 3개월 동안 일관되게 체육관에서 운동한 후 체중계는 크게 변하지 않았지만 거울은 완전히 다른 이야기를 말했습니다. 옷이 다르게 맞았습니다. 에너지 수준이 높았습니다. 사람들이 의견을 제시했습니다. 명백한 질문은 총 체중이 거의 같게 유지되고 있는데 신체 구성이 변하고 있는지 여부였고, 명백한 답변은 체중만이 아니라 체지방 퍼센티지를 아는 것이 필요했습니다. "체지방 계산기"를 빠르게 검색하면 배너 광고와 팝업 뉴스레터 사이에 작은 입력 양식이 있는 수십 개의 광고 수가 많은 웹사이트가 반환되었습니다. 기술적으로는 작동했지만 경험은 끔찍했습니다. 몇 가지 측정을 입력하고 계산을 클릭하고 3개의 광고 스크립트 레이어를 통해 페이지가 다시 로드될 때까지 기다린 후 마지막으로 그것이 의미하는 바나 해당 나이와 활동 수준의 건강한 범위와 어떻게 비교되는지에 대한 맥락 없이 번호를 봅니다.

그 후의 사고 과정은 개발자가 즉시 인식하고 민간인이 당황스러워하는 종류였습니다. "이 계산기는 끔찍합니다. 더 나은 것을 구축하는 것이 얼마나 어렵습니까?" 그 질문에 대한 답은 항상 같습니다. 첫 번째 버전을 구축하는 것은 쉽고 그 다음 범위 크리프는 벽을 올라가는 담쟁이덩굴의 조용한 결정으로 인수합니다. 체지방 계산기는 오후에 완료되었습니다. 그것은 Navy 방법을 사용했고 4가지 측정(목, 허리, 엉덩이, 높이)을 취했고 건강한 범위에 대한 맥락과 함께 결과를 표시했습니다. 깨끗한 인터페이스, 광고 없음, 빠릅니다. 완료되었습니다. 다음 생각이 "누군가 체지방을 확인하고 있다면 아마도 BMI도 원할 것입니다"였기 때문에 완료되지 않았습니다. 그래서 BMI 계산기가 추가되었습니다. 그리고 나서 BMR 계산기가 기초 신진대사 비율을 아는 것이 칼로리 섭취를 관리하는 모든 사람에게 필수적이기 때문입니다. 그리고 나서 일일 칼로리 필요 계산기. 그리고 나서 매크로 계산기. 그리고 나서 물 섭취량 계산기. 각각은 하루나 이틀이 소요되었고 각각은 이전 계산기의 자연스러운 확장처럼 느껴졌습니다. 범위는 크리프하고 있었지만 의미가 있는 방향으로 크리프하고 있었습니다.

건강에서 금융으로의 전환은 화요일 저녁 모기지 옵션을 검토하는 동안 발생했습니다. 은행 웹사이트에서는 원래 검색에서 체지방 계산기보다 어떤 식으로 더 나쁜 모기지 계산기를 제공했습니다. 결과를 표시하기 전에 계정을 작성해야 했습니다. 실제 계정, 전자 메일 확인 단계 포함, 교장을 이자율로 곱하고 12로 나누는 권한을 위해. 기존 계산기 프레임워크가 이미 거기에 있었고 이미 입력 유효성 검사 및 결과 표시를 처리하고 있었습니다. 모기지 계산기를 추가하는 것은 은행의 등록 프로세스보다 시간이 덜 걸렸습니다.

숫자를 포함하는 모든 것으로의 불가피한 확장

건강과 금융 사이의 장벽이 깨진 후 홍수 문이 열렸으며 이는 스릴있고 약간 우려되는 방식이었습니다. 복합이자 계산기가 다음에 왔습니다. 개인 금융 계획은 시간이 지남에 따라 돈이 어떻게 성장하는지 이해하는 것에 달려 있고 대부분의 기존 도구는 개념을 필요로 하는 것보다 이해하기 어렵게 만듭니다. 그리고 나서 대출 상각 계산기는 모기지 옵션을 비교하는 모든 사람이 이자 분해와 함께 전체 상환 일정을 봐야 합니다. 그리고 나서 ROI 계산기, 투자 결정이 자세한 분석을 시작하기 전에 빠른 뒤뚱거리는 추정이 필요합니다. 그리고 나서 통화 변환, 그리고 나서 팁 계산기, 그리고 나서 절약 목표 예측, 그리고 나서 은퇴 계획 추정. 각 계산기는 동일한 기본 아키텍처를 공유했습니다. 구조화된 입력을 취하고 잘 알려진 공식을 적용하고 즉시 유용하도록 충분한 맥락과 함께 결과를 제시합니다.

수학 범주는 고등학교를 가르치는 친구가 플랫폼에 개념과 싸우는 학생을 위한 백분율 계산기를 포함할 수 있는지 물었을 때 나타났습니다. 이 단일 요청은 기본 수학 도구 시리즈를 생성했습니다: 백분율 계산기(X의 X%는 무엇, X는 Y의 몇 퍼센트, 백분율 증가 및 감소), 분수 십진수 변환기, 제곱근 계산기, 일반적인 모양의 면적 및 체적 계산기, 길이, 무게, 온도 및 속도를 다루는 단위 변환기. 이 중 어느 것도 기술적으로 복잡하지 않습니다. 백분율 계산은 사소한 코드입니다. 하지만 명확한 레이블, 유용한 설명 및 페이지 새로고침 없이 즉시 결과를 사용하여 그 사소한 코드를 깨끗한 인터페이스에 래핑하면 손으로 수학을 수행하거나 복잡한 웹 사이트에서 검색하는 것보다 실제로 더 유용한 도구를 만듭니다.

암호화폐 이익 계산기는 여러 암호화폐 위치를 평가해야 할 기간 동안 도착했습니다. "0.5 ETH를 $2,400에 구입했고 현재 $3,100인 경우 0.1% 거래 수수료 후 이익은 무엇입니까?"라는 질문은 간단한 산술이지만, 다양한 동전에 걸쳐 다양한 구매 가격, 수량 및 수수료 구조를 반복하면 빠르게 지루해집니다. 암호화폐 계산기는 구매 가격, 판매 가격, 수량 및 수수료를 하나의 양식으로 처리하고 절대 이익, 백분율 반환 및 수수료 후 순 수익을 표시합니다. 교환과 연결하거나 실시간 가격을 가져오지 않습니다. 그것은 순전히 계산 도구이며 그것이 필요한 모든 것입니다. 라이브 가격은 교환 웹 사이트에 있습니다. 계산은 calculator.yeb.to에 있습니다.

하나의 계산기가 어떻게 아키텍처가 되었는가

한 계산기에서 100개 이상으로의 성장 뒤의 기술 이야기는 초기에 만들어진 아키텍처 결정에 관한 이야기이며 놀랍게도 확장 가능했습니다. 첫 번째 신체 지방 계산기는 하드 코딩된 HTML 양식 필드와 Navy 메서드 공식을 실행한 JavaScript 함수를 사용하여 독립 실행형 페이지로 구축되었습니다. 다섯 번째 계산기까지 패턴은 명백했습니다. 모든 계산기는 명명된 입력 세트(높이, 무게, 비율, 교장, 무엇이든)를 취하고 공식을 적용하고 하나 이상의 명명된 출력(신체 지방 비율, 월간 결제, 복합 합계)을 표시합니다. 공유된 구조는 일반 계산기 구성 요소가 렌더링, 유효성 검사 및 표시 논리를 처리할 수 있으며 각 개별 계산기는 입력, 공식 및 출력 레이블을 정의하기만 하면 됨을 의미합니다.

이 추상화는 20개의 계산기에서 100개로의 폭발이 압도적이지 않은 관리 가능한 느낌이 되게 한 것입니다. 새로운 계산기를 추가하는 것은 처음부터 새 페이지를 구축해야 하지 않습니다. 입력(이름, 유형, 단위, 유효성 검사 규칙) 정의, 계산 함수 작성 및 결과를 표시하는 방법 지정이 필요합니다. 프레임워크는 모든 것을 처리합니다. 반응형 레이아웃, 입력 유효성 검사, 오류 메시지, 결과 형식 지정, 심지어 사용자가 숫자가 의미하는 바를 이해하도록 돕는 설명 텍스트. 전체 플랫폼은 본질적으로 100개의 구성 파일이 있는 하나의 엔진으로 코드베이스가 관리 불가능해지지 않고 무한정 성장할 수 있습니다.

계산기 API는 동일한 엔진을 프로그래밍 방식으로 노출합니다. 외부 응용 프로그램은 입력 값을 보내고 인터페이스 없이 계산된 결과를 받을 수 있습니다. 이것은 자신의 워크플로우에 계산 기능이 포함되어야 하는 응용 프로그램에 유용합니다. 워크 아웃 통계와 함께 BMI를 표시하려는 피트니스 앱은 BMI 공식을 다시 구현하지 않고 API를 호출할 수 있습니다. 복합이자 예측이 필요한 재무 계획 도구는 자신의 복합 논리를 유지하지 않고 API를 호출할 수 있습니다. 공식은 잘 알려져 있으며 소유가 아니지만 올바르게 구현하는 것(경계 사례 처리, 적절하게 반올림, 날짜 기반 계산에서 윤년 계정)은 모든 개발자가 약간 다르게 하고 종종 약간 잘못 수행하는 작업 유형입니다.

통합 플랫폼이 분산 도구보다 더 많은 의미가 있는 이유

통합 계산기 플랫폼의 대안은 대부분의 사람들이 오늘 경험하는 것입니다: 각 계산 유형에 대한 별도의 웹 사이트. 모기지 계산기에 대한 하나의 책갈피. BMI 계산기에 대한 또 다른. 암호화폐 수익 도구에 대한 세 번째. 각 사이트에는 자체 디자인 언어, 자체 광고 배치, 자체 쿠키 동의 팝업 및 결과를 제시하는 자체 방법이 있습니다. 이러한 연결이 끊긴 도구 사이를 전환하는 인지 오버헤드는 실제이지만 누군가 대안을 경험할 때까지 충분히 작아서 눈에 띄지 않습니다.

calculator.yeb.to의 한 지붕 아래에 모든 것이 있으면 이 오버헤드가 제거됩니다. 인터페이스는 모든 계산기에서 일관됩니다. 입력은 같은 방식으로 작동합니다. 결과는 같은 방식으로 형식이 지정됩니다. 설명 컨텍스트는 같은 구조를 따릅니다. BMI 계산기를 사용한 사용자는 상호 작용 패턴이 동일하기 때문에 모기지 계산기를 사용하는 방법을 정확히 알고 있습니다. 이 일관성은 디자인 멋진 것처럼 보일 수 있지만 사용성에 측정 가능한 영향을 미칩니다. 사용자는 도구 작동 방식을 파악하는 데 시간을 덜 보내고 온 이유에 대한 답을 얻는 데 더 많은 시간을 보냅니다.

또한 분산 도구가 복제할 수 없는 발견 이점이 있습니다. BMR을 계산하기 위해 플랫폼을 방문하는 사람은 같은 페이지에서 물 섭취량 계산기를 알아차릴 수 있고 그들이 마셔야 할 물의 양을 실제로 계산한 적이 없다는 것을 깨닫을 수 있습니다. 모기지 결제를 확인하는 사람은 복합이자 계산기를 발견하고 은퇴 프로젝션을 실행하기 시작할 수 있습니다. 관련 도구의 근접성은 고립된 웹 사이트가 제공할 수 없는 자연스러운 탐색 경로를 만듭니다. 왜냐하면 하나의 계산에 최적화된 고립된 웹 사이트는 관련 없는 계산기를 표시할 이유가 없기 때문입니다. 통합 플랫폼은 할 수 있고 합니다. 사용 데이터는 상당한 비율의 사용자가 방문당 2개 이상의 계산기와 상호 작용함을 보여줍니다.

숫자 뒤의 숫자

100개 이상의 계산기를 구축하면 사람들이 계산하는 것과 언제를 계산하는지에 대한 진정으로 흥미로운 관찰이 생성되었습니다. 건강 계산기는 신년 결의 군중이 신선한 체육관 회원의 열정으로 BMI 및 칼로리 계산기에 하강할 때 1월에 급증합니다. 모기지 계산기는 중앙 은행이 이자율 변화를 발표할 때마다 급증하며 때로는 발표 후 몇 시간 이내입니다. 암호화폐 이익 계산기는 Bitcoin의 가격 변동성과 거의 완벽하게 상관관계가 있으며 강세장 중 급증하고 약세장 중 조용합니다. 세금 계산기는 신청 기한 전 주에 절정입니다. 기본 백분율 계산기도 계절 패턴을 가지고 있으며 학생 사용은 시험 기간 중에 절정입니다.

플랫폼에서 가장 인기 있는 계산기는 상당한 차이로 정교한 건강 또는 재무 도구 중 하나가 아닙니다. 간단한 백분율 계산기입니다. "230의 15%는 무엇입니까?" 사람들은 전 세계적으로 매일 수백만 번 이런 종류의 질문을 검색하며 답은 전화의 내장 계산기가 처리할 수 있는 산술입니다. 하지만 사람들은 그런 식으로 생각하지 않습니다. 그들은 그것을 백분율 문제로 생각하고 그들의 특정 입력을 취하고 특정 답을 주는 "백분율 계산기"라고 표시된 도구를 원합니다. 교훈은 계산기의 가치가 공식의 복잡성에 있지 않다는 것입니다. 인터페이스의 명확성과 답변의 속도에 있습니다.

그 첫 번째 신체 지방 계산에서 100개 이상의 도구를 갖춘 플랫폼으로의 여정을 되돌아보면 가장 놀라운 깨달음은 개별 계산기가 구축하기 어렵지 않다는 것입니다. 어려움은 수요가 보편적이었으며 기존 공급이 조각화되고 광고가 많고 사용자 경험에 적대적이라는 것을 인식하는 것이었습니다. 각 계산기는 격리된 것입니다. 함께 그들은 정확히 포괄적이고 일관되고 빠르기 때문에 진정으로 유용한 것을 형성합니다. 그것을 모두 시작한 신체 지방 질문은 여전히 동일한 도구로 답변되며 그것을 추적하도록 도움을 주었던 체육관 진전은 "하나의 계산기"를 구축하려는 원래 계획보다 훨씬 더 일관되게 진행되었습니다.