1 Page Web App to Show Zip Codes in A Radius

Business & Consulting

ZipCodesByRadius is a microsite built by the Cubit Planning team. Cubit Planning sells spreadsheets and reports with demographic data about United States zip codes to small businesses for their sales and marketing campaigns. Target Audience: Our target audience includes real estate brokers, small business owners of physical stores and their assistants. Our best clients are niche business consultants -- think charter school consultants. Our typical client is a 50-year-old white male who is the owner, founder and manager of a small (< 5 person) business. They are passionate about their business and think of themselves as data driven. Many clients are NOT tech savvy.

We’re building a tool to help website visitors get a list of US postal zips codes in a radius. How the tool will work 1. A website visitor will enter any radius distance in miles (from 1 mile to 50 miles) and a starting zip code. 2. Then the tool will: a. display a label/pin for the starting zip b. a polygon denoting the radius distance (a circular polygon) c. labels/pins for all zips found by the app to be within the radius d. display a copy/paste-friendly text listing of results e. OR display actionable error messages (depends on design of course, so ignore if unnecessary) i. ZIP Code not found, please try again, or try a different zip code. ii. Please enter a zip code iii. Please enter a radius distance (if it's an input, ignore if unnecessary) You can see similar tools here: • https://www.freemaptools.com/find-zip-codes-inside-radius.htm • https://www.unitedstateszipcodes.org/zip-code-radius-map.php • https://ezlocal.com/tools/map-radius/ • http://www.mapszipcode.com/zip-code-radius/ • https://www.zipcodestogo.com/lookups/radius-search.php Map will be done in Carto & here are details about Carto Map design • https://docs.carto.com/carto-user-manual/maps/map-styles The app will be the first thing a visitor sees at the top of the zip pages like this one: https://www.zipcodesbyradius.com/texas/78745

Problems we want you to solve 1. What should the pins look like? 2. What should be which color? 3. What should the radius look like? 4. What’s the type hierarchy (h1 versus h2 – apply our design system)? Stylistic preferences Font Family: --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; Colors as hex codes/css: // 2. Include any default variable overrides here $zipx-dark-blue: #384087; $zipx-red: #D83225; $zipx-dark-gray: #4F575E; $zipx-medium-blue: #BABFD3; $zipx-light-blue: #D9DBEB; $zipx-light-gray: #F7F7F7; $zipx-white: #FFFFFF;

Every design category has flexible pricing for all budgets. Other web or app design starts at HK$4,699.