포스텍

UI/UX

DATE 2025.01

01

OVERVIEW

정밀한 기술력과 혁신으로 미래를 연결하는 광통신 종합 솔루션 기업, Fostec

Fostec은 광통신 부품 설계 및 제조 분야에서 축적된 기술력을 바탕으로,
방산·데이터 센터·차세대 네트워크 구축에 필수적인 고품질 광통신 솔루션을 제공하고 있습니다.
AI, 6G 등 미래 산업을 선도하는 기술 파트너로 성장하고 있습니다.

02

DESIGN CONCEPT

포스텍의 다양한 사업 분야를 통일성 있는 심플한 레이아웃으로 구성하여 정보를 가독성 있게 전달합니다.
브랜드의 정체성을 반영한 오렌지 계열의 포인트 컬러와 글라스모피즘 요소를 활용해,
방문자들에게 시각적 임팩트를 더하고 브랜드 가치를 효과적으로 전달합니다.

명확한 정보 구조와 흐름

정제된 레이아웃과 가독성 높은 구성으로, 다양한 정보를 한눈에 이해할 수 있게 설계

Structure
&
Readability

브랜드 중심의 시각 언어

브랜드 정체성을 담은 컬러와 톤을
통일감 있게 반영하여 시각적 인지도를 강화

Visual Identity

감각적인 디지털 표현

글라스모피즘과 최신 UI 요소를 반영해
기술적이면서도 세련된 브랜드 이미지를 구축

Trendy
&
Modern

03

DESIGN SYSTEM

일관된 컬러, 명료한 타이포그래피

브랜드의 아이덴티티를 담은 오렌지 컬러를 메인으로 설정해 시각적 일관성과 인상을 강화했습니다.
정보량이 많은 구성을 고려하여, 가독성이 우수한 고딕체를 사용함으로써 정보 전달의 명료함과 효율성을 높였습니다.

FONT&COLOR

POINT

#ED6B00

SUB 01

#302D2C

SUB 02

#707070

SUB 03

#302D2C

04

MAIN PAGE

편의성과 직관성을
모두 고려한 디자인 구성

포스텍의 다양한 기술을 시각적으로 조화롭게 구성해 전문적인 정보를 직관적으로 전달합니다.
브랜드 아이덴티티를 담은 오렌지 컬러를 중심으로 정체성을 명확히 하고,
통일된 톤앤매너와 라운드 요소를 활용해 신뢰감과 편안함을 함께 담았습니다.
한눈에 핵심을 파악할 수 있는 레이아웃을 통해 사용자의 접근성과 편의성 또한 고려한 메인페이지입니다.

홈페이지 바로가기

05

SUB PAGE

효과적인 정보 전달을 위한
다양한 컨텐츠 구성

서브페이지 상단에 사이드 메뉴를 배치하여 정보 접근성을 높였습니다.
다양한 콘텐츠는 도식화와 이미지 등을 활용해 시각적으로 구성하였으며,
한눈에 핵심 내용을 파악할 수 있는 구조로 사용자 경험의 완성도를 높였습니다.

06

PRODUCT PAGE

제품페이지

제품 페이지는 이미지 중심으로 시각적 몰입도를 높이는 레이아웃으로 구성하였습니다. 페이지 중앙에는 제품에 대한 영상을 배치해 사용자의 이해도를 높였으며, 하단에는 제품의 상세 정보, 사양, 주문 정보, 관련 제품 등을 한눈에 확인할 수 있는 섹션을 마련하여 정보 접근성과 사용자 편의를 함께 고려하였습니다.