AA 아키그룹 - UX/UI Review
UX/UI Review

AA 아키그룹

발행일·

건축 전문 조직의 신뢰·정확·경험을 중심으로, 정보구조와 시각 언어를 최적화하여 사용자가 프로젝트의 규모와 전문성을 자연스럽게 이해하도록 돕는 리뷰입니다.

더블루캔버스 살펴보기
AA 아키그룹 대표 비주얼

브랜드·목표 개요

AA 아키그룹은 공간의 기능성과 미감, 그리고 도시 맥락을 연결하는 건축사무소입니다. 본 리뷰는 해당 조직의 디지털 터치포인트를 중심으로, 브랜드 인지와 리드 유입을 동시에 달성할 수 있는 정보구조(IA)사용성(UX) 정비 방향을 제안합니다. 핵심은 방문자가 첫 화면에서 ‘우리가 누구인지’, ‘어떤 규모의 프로젝트를 수행하는지’, ‘왜 신뢰할 수 있는지’를 즉시 파악하게 하는 것입니다. 이를 위해 프로젝트 카테고리(주거·업무·문화·도시재생 등)와 제공 서비스(기획·설계·감리·리모델링)를 명확히 구분하고, 사례 중심의 내러티브를 통해 전문성을 증명하는 구성을 권장합니다. 또한 모바일 관점에서 터치 타깃, 폰트 스케일, 대비·명도 등 접근성 요소를 점검하여 다양한 사용 환경에서도 동일한 신뢰감을 제공해야 합니다.

핵심 제안: 첫 화면에는 명확한 가치 제안(One-liner), 대표 프로젝트 1건의 압축 스토리, 그리고 문의 유도 버튼을 함께 배치해 전환 흐름을 단축합니다.

UX/UI 전략과 정보구조

건축 분야는 전문 용어와 복잡한 의사결정이 빈번해, 사용자에게 ‘쉬운 구조’와 ‘명확한 언어’가 무엇보다 중요합니다. 프로젝트 아카이브는 카테고리·규모·연도·상태(준공/진행)를 기준으로 필터링이 가능해야 하며, 각 상세 페이지는 문제 정의 → 설계 의도 → 솔루션 → 성과 순의 일정한 스토리라인을 유지하는 것이 바람직합니다. 메인 내비게이션은 5개 이내의 1차 메뉴로 단순화하고, CTA는 일관된 색상과 문구로 인지 부하를 낮춥니다. 또한 스크롤에 따른 점진적 공개(Progressive disclosure)를 활용해 정보량은 풍부하되 화면은 경쾌하게 유지합니다. 그리드 시스템은 8pt 단위를 기준으로 하며, 이미지 캡션에는 설계 키워드와 용적률/연면적 등 핵심 수치를 노출해 전문성을 직관적으로 전달합니다.

시각 언어와 인터랙션

건축 이미지는 브랜드 신뢰를 강화하는 가장 강력한 자산입니다. 영웅 섹션에서 대표 이미지 1장을 큼직하게 사용하고, 잔상/그레인/오버블렌드 등 과도한 효과는 배제하여 재료감과 구조적 미를 그대로 보여주는 편이 설득력이 높습니다. 버튼·뱃지·모듈 간 여백은 충분히 두어 고급스러운 호흡을 만들고, 카드 호버는 섬세한 그림자와 미세한 확대만으로 반응성을 표현합니다. 전반적 색상 체계는 뉴트럴 톤을 기본으로, 포인트 컬러는 #0b5bcb 계열의 청색을 사용하여 신뢰·전문성 이미지를 강조합니다. 섹션 진입 애니메이션은 200–250ms의 가벼운 페이드/슬라이드로 제한해 몰입을 방해하지 않도록 합니다. 사진 하단 캡션에는 프로젝트명, 위치, 프로그램, 연도 등 핵심 정보만 간결히 제공합니다.

AA 아키그룹 프로젝트 대표 이미지
대표 프로젝트 비주얼: 구조적 리듬과 채광의 균형을 강조한 장면.

접근성·성능·SEO 최적화

핵심 사용성 지표는 WCAG 2.1 AA 기준을 바탕으로 점검합니다. 텍스트 대비는 최소 4.5:1, 인터랙티브 요소의 포커스 링은 명확히 표시하고, 키보드 전환 및 스크린리더 흐름을 고려한 landmark(헤더/메인/내비/풋터) 구조를 유지합니다. 성능 측면에서는 이미지 지연 로딩과 차세대 포맷(WebP/AVIF) 제공을 병행하되, 원본도 보존해 호환성을 확보합니다. 또한 LCP는 2.5초 이하, CLS는 0.1 이하를 목표로 레이아웃 시프트를 최소화합니다. SEO는 구조화된 데이터(Organization, BreadcrumbList, Article)와 의미적 마크업(h1–h3, figure/figcaption)을 적극 활용해 검색 가시성을 높입니다. 각 페이지의 메타 타이틀/디스크립션은 60/155자 내로 관리하고, 프로젝트 상세에는 지역·프로그램 키워드를 자연스럽게 녹여 롱테일 유입을 확보합니다.

체크리스트: 대체 텍스트의 맥락성, 스켈레톤/프리로딩 전략, OG/Twitter 카드, 사이트맵·로봇스 설정, 검색 콘솔 연결.

더블루캔버스 소개

더블루캔버스는 전략·디자인·엔지니어링이 긴밀히 맞물리는 디지털 제품/웹사이트 구축을 수행합니다. 초기 리서치와 경쟁 분석, UX 시나리오와 IA 설계, 컴포넌트 기반 UI 시스템, 퍼포먼스·접근성·SEO 최적화까지 한 흐름으로 연결하여 실행합니다. 건축/부동산/도시 영역의 복잡한 데이터와 내러티브를 다뤄 본 경험을 바탕으로, 브랜드의 본질을 흐리지 않는 간결한 구조와 정교한 마이크로 인터랙션을 제안합니다. 협업을 원하신다면 아래 링크를 통해 포트폴리오와 서비스를 확인해 주세요.

더블루캔버스 바로가기

문의 및 다음 단계

리브랜딩/리디자인, 신규 런칭, 콘텐츠 전략, 카탈로그형 아카이브, 다국어 확장 등 다양한 목적에 맞춘 실행 로드맵을 설계해드립니다. 간단한 현황 공유만으로도 개선 우선순위와 예상 임팩트를 빠르게 정리해 드리며, 필요 시 파일럿 스프린트로 리스크를 최소화할 수 있습니다. 빌드 후에는 측정 가능한 KPI 체계를 도입해 성과를 투명하게 관리합니다.