준비된사람들의 이야기

[광주 병원동행] 투석 혈관이 막혔을 때, 자녀분 대신 달려간 긴급 동행 사례

readypeople — Wed, 1 Apr 2026 18:42:37 +0900

광주 병원동행서비스 준비된사람들

안녕하세요.

광주 병원동행서비스 준비된사람들입니다.

최근 혈액투석을 받으시는 어르신께서

투석 혈관이 막혀 급하게 함께 외래를 다녀와야 했던 사례가 있었습니다.

오늘은 혈액투석의 기본 구조와 함께,

긴박했던 그날의 동행 이야기를 전해드리려 합니다.

■ 혈액투석, 왜 '특수한 혈관'이 필요한가요?

투석이란 만성신부전 환자의 혈액에서 노폐물을 제거하는 것을 말하며,

혈액투석과 복막투석이 있습니다.

그 중 혈액투석은 혈액투석장치를 이용하여

혈액 속의 노폐물과 수분을 제거하고 전해질의 균형을 유지하는 방법입니다.

그런데 혈액투석은 일반적인 주사처럼 얇은 혈관을 사용할 수는 없습니다.

혈앱 투석은 몸에서 분당 200ml 이상의 많은 혈액을 빼낸 뒤에

필터로 혈액을 걸러 다시 몸 속으로 넣어주어야 하기 때문입니다.

일반적인 말초혈관을 통해서는 이 정도의 혈류량을 감당할 수 없습니다.

출처: 남양주한양병원, 「혈액투석 환자가 알아야 할 투석혈관(동정맥루) 관리법

그래서 보통은 수술을 통해 동맥과 정맥을 연결하여 만든

'동정맥루'라는 특수한 투석 혈관을 만듭니다.

혈관을 튼튼하고 굵게 만들어서 투석이 가능하도록 하는 것이죠.

■ "투석을 못 한대요.." 긴박했던 긴급 동행의 순간

문제는 이 동정맥루를 오래 사용하다 보면

혈관이 좁아지거나 막히는 경우가 생긴다는 점입니다.

이번에 저희를 찾아주신 어르신도 당일 투석을 시도하다가

혈관이 막힌 것을 발견하셨습니다. 당장 외래 진료와 시술이 급박한 상황이었죠.

하지만 자녀분들은 타지에 계셨고,

광주까지 내려오기엔 시간이 꽤 걸리는 상태였습니다.

병원도 당일 진료이기에 대기 시간이 매우 깁니다.

자녀분이 도착한 뒤에 병원에 가면 시술이 너무 늦어질 위험이 있었기에,

자녀분께서는 저희 '준비된사람들'에 긴급 동행을 요청하셨습니다.

■ "미안함 대신 안심을 전해드렸습니다"

광주 병원동행서비스 준비된사람들

저희는 즉시 어르신 계시는 요양병원으로 이동하여

병원까지 안전하게 모셨습니다.

자녀분이 오시는 동안 우선 접수를 마치고

대기 시간을 최소화하며 어르신 곁을 지켰습니다.

사실, 매번 긴급 요청에 100% 응대하기란 쉽지 않습니다.

대기 인력이 모두 현장에 나가 있는 경우도 있으니까요.

하지만 단 한 분에게라도 이 서비스가 반드시 필요하다는 것을 알기에,

저희는 긴급 동행 서비스를 포기하지 않고 운영하고 있습니다.

불안해하시는 어르신의 손을 꼭 잡아드리고,

평소 자녀들에게 차마 털어놓지 못했던 고충들을 묵묵히 들어드렸습니다.

나중에 도착하신 자녀분께서 감사하다며 고마워하실 때,

저희의 진심이 닿은 것 같아 큰 보람을 느꼈습니다.

준비된사람들은 "무조건 다 됩니다"라는 지키지 못할 약속은 하지 않습니다.

하지만 도움이 필요한 그 결정적인 순간에

가장 먼저 손 잡아줄 수 있는 사람이 되기 위해 최선의 노력을 다하고 있습니다.

갑작스러운 상황에서도 당황하지 마세요.

광주 지역 어르신의 건강한 일상을 위해, 저희가 늘 곁에서 함께 하겠습니다.

매번 믿고 찾아주시는 모든 분들께 감사합니다.

지금까지 준비된사람들이었습니다.

062-222-3650

0507-1308-6724

광주 병원동행서비스 준비된사람들

출처

남양주한양병원 의료칼럼

가톨릭관동대학교 국제성모병원 건강바이블

서울아산병원 검사/시술/수술정보

의료비 지원, 본인일부부담금 산정특례 제도 뜻, 대상자, 혜택 등 총정리

readypeople — Wed, 1 Apr 2026 18:37:23 +0900

광주 병원동행서비스 준비된사람들

안녕하세요.

광주 병원동행서비스 준비된사람들입니다.

암이나 희귀질환 진단을 받으면

치료보다 더 걱정되는 게 병원비인데요.

실제로 많은 분들이 수백만 원 이상의 치료비 때문에

치료를 망설이기도 합니다.

하지만 '산정특례 제도'를 적용받으면

본인부담금을 크게 낮출 수 있다는 사실, 알고 계셨나요?

그래서 오늘은 이러한 산정특례 제도를

어떤 분들이 받으실 수 있는지,

본인부담률은 어느 정도인지,

신청 방법은 어떻게 되는지

알아보도록 하겠습니다.

광주 병원동행서비스 준비된사람들

먼저, 산정특례 제도 뜻부터 알고 갈게요.

대부분 질병들에는 의료 보험이 적용되어서

20% 혹은 30% 정도의 본인부담률이 적용되곤합니다.

그런데, 이 20%, 30%에 해당되는 본인부담률을

경감해주는 제도가 산정특례 제도입니다.

특히나 암, 뇌 질환 등 중증질환자와

희귀질환자, 중증난치질환자는 진료비 본인부담이 높은데요.

이 진료비의 본인부담률을 5~10% 수준으로 경감해주는 거예요.

그러면 누가 이 혜택을 받을 수 있는지 궁금하실텐데요.

광주 병원동행서비스 준비된사람들

그래서 이번엔 산정특례 대상자입니다.

대상자는 아래와 같습니다.

암, 심혈관 질환, 호흡기 질환, 유전 질환, 만성 질환, 정신 질환,

특정 치료법 적용 환자, 재활 치료가 필요한 환자 등이 해당됩니다.

「본인일부부담금 산정특례에 관한 기준」에서 정하는

암, 중증화상 등 중증질환, 희귀 및 중증난치질환, 중증치매, 결핵, 잠복결핵 질환으로

확진받아 의사가 발행한 산정특례 등록 신청서를 공단에 제출한

건강보험가입자 또는 피부양자가 해당됩니다.

※ 단, 뇌혈관·심장질환·중증외상은 등록절차 없이

고시에서 정한 상황 발생 시 산정특례 적용

혹시, 자신이 대상이 되는지 궁금하시다면

아래 링크를 클릭해주세요.

https://www.nhis.or.kr/nhis/minwon/minwonServiceBoard.do?mode=view&articleNo=10945821

산정특례 등록내역 조회 | 국민건강보험

진료비 부담이 높고 장기간 치료가 요구되는 중증질환에 대하여 건강보험 본인부담을 경감시켜주는 산정특례 제도의 본인 등록내역을 조회하는 서비스입니다.

www.nhis.or.kr

광주 병원동행서비스 준비된사람들

그러면 얼마나 경감되는 걸까요?

산정특례 적용 전이라면

외래(입원할 정도로 중증은 아니며 통원이 가능한 경우)와

입원 환자에게 각각 30~60%, 20%를 납부해야 합니다.

그런데,

산정특례 적용 후에는

외래, 입원 관계없이 0~10%만 지불하면 됩니다.

단, 급여 진료비(건강보험이 적용되는 항목)의

본인부담률을 낮추는 제도이므로,

비급여항목(선택진료비, 미용 목적의 성형수술비,

1,2,3인실과 같은 상급병실료, 일부 고가 검사 등)은

혜택이 적용되지 않습니다.

또한, 본인부담률을 별도로 특정한 경우나

비급여 진료비에는 적용이 불가합니다.

질환별 산정특례 본인부담률과 적용기간이 궁금하시다면

위 링크 참고해주세요.

광주 병원동행서비스 준비된사람들

그러면 어떻게 신청하면 되나요?

산정특례는 자동으로 적용되지 않으며,

반드시 의료기관을 통해 등록 신청을 해야 합니다.

1) 진단 및 확진

전문의에게 해당 질환 여부를 검사받고 확진 판정을 받습니다.

2) 신청서 작성

의사가 발행한 '건강보험 산정특례 등록 신청서'를 발급받습니다.

3) 등록 신청

① 병원 대행

대다수 병원에서 전산(EDI)을 통해 직접 신청해줍니다.

② 직접 신청

환자가 직접 신청서를 지참하여

국민건강보험공단 지사에 방문하거나

팩스, 우편으로 제출할 수도 있습니다.

③ 온라인

국민건강보험공단 홈페이지 신청

단, 산정특례는 암·희귀질환·중증난치질환으로

확진된 날부터 30일 이내에 공단에 등록 신청해야

혜택을 받을 수 있으니 이 점 꼭 숙지해두세요.

산정특례 제도는

알고 있으면 병원비 부담을 크게 줄일 수 있지만,

모르면 그대로 비용을 부담해야 하는 제도입니다.

특히 신청 시기나 적용 기준을 놓치면

혜택을 받지 못하는 경우도 있기 때문에

정확한 확인이 중요합니다.

병원 진료를 앞두고 있거나

이미 치료를 시작하신 상황이라면

지금이라도 적용 가능 여부를 꼭 확인해보시길 바랍니다.

준비된사람들은

병원 동행 과정에서 이런 제도 안내부터 진료까지

함께 도와드리고 있습니다.

필요하신 경우, 언제든 편하게 문의주세요.

지금까지 준비된사람들이었습니다.

062-222-3650

0507-1308-6724

광주 병원동행서비스 준비된사람들

출처:

국민건강보험공단

[광주병원동행] 방사선 치료 부작용은 왜 생길까요? 그리고 어떻게 관리해야 할까요? | 준비된사람들

readypeople — Wed, 25 Mar 2026 13:59:00 +0900

광주 병원동행 서비스 준비된사람들

안녕하세요.

광주 병원동행서비스 준비된사람들입니다.

매일 같이 방사선 치료를 받으시기 위해 병원으로 향하는 어르신을 보면

회차가 거듭될수록 얼마나 발걸음이 무거워지는지 체감하는데요.

치료 자체도 힘들지만, 그와 동반되는 피로감이나 여러 부작용들이

더 발걸음을 무겁게 하곤 합니다.

그럼에도 어느정도 방사선 치료의 부작용을 알고 대비하면

그 긴 여정이라도 이겨낼 힘 또한 더불어 갖게 되는 것 같습니다.

오늘은 이러한 마음을 소망하며,

왜 방사선 치료 시에 이런 부작용이 생기는지,

그리고 각 가정에서 실천할 수 있는 식단이나 피부 케어 방법에 대해서

나눠보도록 하겠습니다.

광주 병원동행서비스 준비된사람들

먼저, 방사선 치료 시에 부작용이 생기는 이유는 무엇일까요?

방사선은 강한 에너지라고 생각하면 됩니다.

그 강한 에너지로 세포에 조사하여 세포를 죽이는 것이

방사선 치료의 기전인데요.

조금 더 쉽게 설명드리면,

태양과 같은 강한 에너지가 한 곳을 강렬하게 쬐면서

그 한 곳을 태워버리는 방식을 생각하시면 될 것 같아요.

이런 방식으로

암 세포를 죽이는 것이 암 치료이자 방사선 치료의 목표인데요.

문제는 높은 방사선의 양이 암세포를 죽이기도 하지만,

치료범위 안의 정상 세포도 손상을 준다는 점입니다.

그래서 이러한 부작용이 생기는 건데요.

그럼에도 충분한 휴식과 적정한 영양섭취를 한다면

치료에 따르는 부작용을 견딜 수 있는 요인으로 작용합니다.

그렇다면 이제부터

피로, 피부, 메스꺼움과 구토까지

이 세 가지의 대표적인 방사선치료의 부작용을 알아보고,

그에 알맞는 케어 방법까지 공유해보도록 하겠습니다.

광주 병원동행서비스 준비된사람들

첫 번째 부작용은 피로입니다.

치료를 받는 동안 신체는 여러 에너지를 사용합니다.

가령, 매일 받는 방사선 치료, 정상세포에 대한 방사선 영향,

병에 대한 스트레스, 불안, 빈혈, 식욕부진 등이 에너지를 소모시키고

이로 인해 피로의 원인이 되는 것이죠.

그래도 치료가 끝나면 회복된다고 하는데요.

문제는 치료 중이겠죠.

몇 가지 피로에 도움되는 방법들을 전달드릴게요.

- 치료 전보다 더 많이 휴식을 취하며, 일상생활 도중 잠깐씩 휴식을 취합니다.

- 하루 15~30분 정도 산책, 스트레칭, 요가 등 가벼운 운동을 합니다.

- 술, 카페인이 함유된 음식(커피, 홍차, 초콜릿)은 제한하고 담배는 금하셔야 합니다.

- 편안한 수면을 위해 낮잠은 30분 이하로 하고,

잠자리에 들기 직전 수분은 제한하며 조용한 음악을 듣거나 책을 읽습니다.

광주 병원동행서비스 준비된사람들

그리고

두 번째 부작용은 피부입니다.

방사선이 조사된 국소적인 부분의 피부에

건조, 붉어짐, 부어오름, 가려움증, 벗겨짐, 약해짐, 색이 어두워짐 등의

증상이 나타날 수 있습니다.

매일 방사선치료 시에 방사선이 피부를 통과하기 때문에

피하기 어려운 증상입니다.

방사선 양이나 치료부위에 따라 차이가 있지만

대개 방사선치료 후 1~2주부터 시작되고,

치료가 끝나도 몇 주간은 지속됩니다.

그러면 어떻게 피부를 관리해야 할까요.

- 치료 받는 부위를 긁거나 때를 밀거나 문지르지 않습니다.

- 사우나, 찜질방, 반식욕, 온천 등을 하지 않습니다.

- 향수, 화장품 등도 사용하지 않도록 합니다.

- 몸에 꽉 끼이는 옷보다는 면으로 된 헐렁한 옷이 낫습니다.

- 모자나 스카프 등을 이용하여 치료 부위가 햇빛에 노출되지 않도록 합니다.

광주 병원동행서비스 준비된사람들

이번엔

세 번째 부작용 메스꺼움과 구토인데요.

위, 소장, 대장, 머리에 방사선치료를 받는 경우에 나타날 수 있습니다.

방사선치료를 받은 후 30분 정도 후에 나타나

몇 시간 동안 지속될 수도 있습니다.

이러한 경우,

- 치료 도중에 구토가 발생하는 경우에는

치료 1~2시간 전부터 음식물 섭취를 피하세요.

- 적은 양을 천천히 자주 드세요.

- 식사 전후에 다량의 물은 식욕감퇴와 구토를 유발하므로 피하도록 합니다.

- 처방받은 구토 억제제가 있으면 식사 30분~1시간 전에 복용하도록 합니다.

혹시나,

구토 후 목에 음식물이 걸린 느낌과 기침이 계속되는 경우,

구토가 하루 6회 이상 지속되는 경우,

매우 힘이 없거나 현기증이 있을 경우,

처방받은 구토 억제제를 복용한 후에도 증상이 심한 경우에는

의료진과 상의해야 합니다.

부작용은 치료 부위에 따라서도 다르게 나타나기도 합니다.

또한, 위의 부작용 외에도

설사, 탈모, 구강변화, 성기능 장애, 연하통증,

소변과 방광의 변화, 림프부종까지 다양합니다.

방사선 치료는 암세포와 싸우는 동시에,

내 몸을 다시 세우는 인내의 시간인 것 같습니다.

때로는 탈모나 설사와 같은 예상치 못한 불편함이 찾아올 때면

환자의 마음, 보호자의 마음까지 어려워질 때가 있습니다.

그러나,

이는 우리의 몸이 열심히 회복하고 노력하고 있다는

증거이기도 합니다.

오늘 정리해드린 부작용 관리 팁이

그 마음에 조금이나마 위로가 되길 소망합니다.

지금까지

준비된사람들이었습니다.

062-222-3650

0507-1308-6724

광주 병원동행서비스 준비된사람들

출처

건양대학교병원

국가암지식정보센터

국립암센터

요양보호사 선생님들을 위한 준비된사람들 활용법!

readypeople — Mon, 16 Mar 2026 17:31:52 +0900

광주 병원동행 준비된사람들

안녕하세요.

프리미엄 동행서비스 플랫폼,

준비된사람들입니다.

매번 어르신과 보호자의 입장에서

블로그 글을 업로드 하다가

오늘은 현장에서 귀한 수고를 해주시는

요양보호사 선생님들을 위한 글을 발행하려고 합니다.

바로,

준비된사람들 플랫폼 활용방법인데요.

한 단계씩 차근차근 설명해드리도록 하겠습니다.

시작하기 전에 일단, 다음의 사항을 전제로 합니다.

- 회원가입 완료

- 로그인 완료 후 관리자 승인 완료

- 서비스 의뢰 후 매칭 완료

위의 전제가 다 충족되었다고 한다면

다음을 따라해주시면 됩니다.

[1단계 : 시작하기]

첫 번째로 매칭인증 절차가 필요합니다.

매칭 인증하는 절차는 2가지가 있는데요.

한 가지씩 설명드릴게요.

① '자세히보기' 선택

광주 병원동행 준비된사람들

위의 노란색 동그라미처럼 '자세히보기'를 선택하는 거예요.

이때, 주의해야 할 사항은!

여러 개 서비스가 의뢰되어 있을 수 있으니

날짜와 시간을 확인해야 합니다.

*옆으로 넘길 수 있다면 여러 서비스가 의뢰된 상태인 거예요.

그리고 날짜를 확인했다면 '자세히보기'를 선택합니다.

그리고 만약 위의 방법으로는 어렵다고 생각되시는 분은

아래의 두번째 방법을 선택하시면 됩니다.

② '나의 예약' 선택

광주 병원동행 준비된사람들

이번엔 노란색 동그라미처럼

'나의 예약'을 선택하는 방법이 있습니다.

그러면 우측과 같이 여러 예약 건이 보일 거예요.

이 중 해당하는 날짜, 어르신을 확인하고 클릭하시면 됩니다.

그 다음!

[2단계 : 매칭 사진찍기]

광주 병원동행 준비된사람들

위의 1단계를 거쳐서 들어오면 위와 같은 화면이 나옵니다.

그러면 노란색 동그라미가 있는 '매칭 인증하기'를 선택하시면 됩니다.

광주 병원동행 준비된사람들

그러면 위와 같은 화면이 나오는데요.

왼쪽 사진처럼 '촬영하기'를 클릭하고, 사진 촬영을 해야 합니다.

사진은 어르신을 만났다는 확인 차원에서

어르신 대문 현관을 찍어주시면 됩니다.

그리고 '매칭 인증하기'를 눌러주세요.

광주 병원동행 준비된사람들

그러면 '예약 당일입니다.'의 좌측 초록색이

'진행중입니다.'로 이동합니다.

그러면 매칭 인증은 완료가 됩니다!

[3단계 : 서비스 종료하기]

이제 예정된 시간 동안 서비스를 진행한 후에

서비스 종료할 시간이 다가오겠죠.

광주 병원동행 준비된사람들

그때에는 페이지를 좀 내리면

'서비스 종료하기' 버튼이 있습니다.

따로 인증할 필요없이 해당 버튼을 누르면 종료됩니다.

한 두번 사용하시면 우리 선생님들 금방 활용하시더라고요.

너무 어려워하지 마시고, 혹시나 사용법 관련하여 궁금한 사항 있으시면

언제든 연락주세요.

늘 사랑의 수고를 더해주시는 선생님들의 노고에

감사한 마음입니다.

지금까지 준비된사람들이었습니다.

감사합니다.

062-222-3650

0507-1308-6724

광주 병원동행 준비된사람들

홈페이지 리뉴얼 ep.4 – 서비스 알아보기 페이지에서 회사 소개 페이지로 구조 전환

gapsw2197 — Fri, 13 Mar 2026 16:35:22 +0900

이번에는 서비스 알아보기 페이지를

회사 소개 페이지로 구조 전환한 내용에 대해 이야기해보려고 합니다.

1. 왜 서비스 알아보기 페이지를 바꾸었는가

기존 웹사이트에는 ‘서비스 알아보기’ 페이지가 존재했습니다.
이 페이지는 서비스에 대한 내용을 소개하기 위해 만들어졌으며,

서비스 요금이나 앱 사용 방법 등에 대한 정보가 포함되어 있었습니다.

하지만 리뉴얼을 진행하며 서비스에 대한 핵심 설명은

메인 페이지에서 전달하는 것이 더 적절하다고 판단했습니다.
실제로 메인 페이지에서 서비스의 주요 내용과 이용 흐름을 충분히 설명하도록 구조를 변경하면서,

기존 ‘서비스 알아보기’ 페이지에는 서비스에 대해 새롭게 전달할 내용이 거의 남지 않게 되었습니다.

또한 페이지 곳곳에는 사용자에게 의미 있는 정보를 전달하지 못하는 dead zone이 공간을 차지하고 있었고,

전체적으로 페이지의 목적이 명확하지 않은 상태였습니다.

그래서 서비스 관련 설명은 메인 페이지로 옮기고,

이 페이지의 역할을 다시 정의하기로 했습니다.

‘서비스를 설명하는 페이지’가 아니라
준비된사람들이 어떤 회사인지,

어떤 태도와 마음가짐으로 서비스를 운영하고 있는지를 전달하는 페이지로

전환하기로 한 것입니다.

우리가 어떤 태도로 일에 임하고 있는지,
그리고 고객에게 어떤 약속을 드리고 있는지를 보여줄 수 있다면
서비스에 대한 신뢰도 역시 더 자연스럽게 전달될 것이라고 생각했습니다.

그래서 이번 리뉴얼에서도 페이지 기획부터 다시 시작했습니다.

서비스 기능을 설명하는 페이지가 아니라
회사를 소개하고 신뢰를 전달하는 페이지로 구조를 전환하기로 했습니다.

2. 회사 소개 페이지 구조 설계

페이지의 역할을 회사 소개 페이지로 전환하기로 결정한 이후,
다음으로 고민해야 했던 것은 어떤 내용을 어떤 순서로 전달할 것인가였습니다.

회사 소개 페이지는 단순히 회사 정보를 나열하는 공간이 아니라,
사용자가 준비된사람들이 어떤 회사인지 자연스럽게 이해할 수 있도록
이야기의 흐름을 가진 구조가 필요하다고 생각했습니다.

그래서 페이지를 위에서 아래로 읽어 내려가면서

어떤 회사인지
어떻게 성장해 왔는지
어떤 성과를 만들어왔는지
어떤 태도와 방향성을 가지고 있는지

를 자연스럽게 이해할 수 있도록 구성하기로 했습니다.

이러한 흐름을 바탕으로 회사 소개 페이지를 다음과 같은 섹션 구조로 설계했습니다.

CompanyHeroSection
CompanyHistorySection
CompanyGrowthSection
OurPromiseSection
TeamMissionSection

각 섹션은 다음과 같은 역할을 하도록 기획했습니다.

1. CompanyHeroSection

준비된사람들이 어떤 회사인지 한눈에 전달하는 영역입니다.

메인 카피와 배경 이미지를 통해
페이지의 분위기와 메시지를 먼저 전달하고,
아래 섹션으로 자연스럽게 이어질 수 있도록 스크롤 버튼을 함께 구성했습니다.

2. TeamMissionSection

마지막으로 팀의 미션과 방향성을 소개하는 섹션입니다.

준비된사람들이 어떤 목표를 가지고 서비스를 운영하고 있는지,
그리고 앞으로 어떤 방향으로 나아가려고 하는지를
사용자에게 전달하는 역할을 합니다.

3. CompanyGrowthSection

회사 성장 지표를 보여주는 성과 섹션입니다.

재방문율, 이용자 수, 서비스 이용 건수 등
서비스가 실제로 어떻게 성장해 왔는지를
KPI 카드 형태로 시각화하여 구성했습니다.

이를 통해 준비된사람들이 단순한 서비스가 아니라
실제 이용자 기반을 가지고 성장하고 있는 서비스라는 점을
데이터로 전달하고자 했습니다.

4. OurPromiseSection

준비된사람들이 고객에게 전달하고 싶은

서비스 철학과 약속을 보여주는 영역입니다.

이 섹션에서는 단순한 기능 설명이 아니라
서비스를 운영하는 태도와 가치관이 전달될 수 있도록 구성했습니다.

5. CompanyHistorySection

준비된사람들이 어떤 과정을 통해 성장해 왔는지를 보여주는
회사 연혁 섹션입니다.

2023년부터 현재까지의 주요 이력들을
타임라인 형태로 구성하여
회사의 성장 과정을 시간 흐름에 따라 확인할 수 있도록 했습니다.

이렇게 회사 소개 페이지의 정보 구조를 설계한 이후,
각 섹션을 실제 UI로 구현하기 위한 컴포넌트 구조 설계를 진행했습니다.

이렇게 기존의 ‘서비스 알아보기’ 페이지를
준비된사람들의 회사 소개 페이지로 구조 전환하는 작업을 진행했습니다.

기존 페이지는 서비스 정보와 회사 소개 성격의 내용이 혼재되어 있어
페이지의 목적이 명확하지 않았지만,
이번 리뉴얼을 통해 회사의 성장 과정과 서비스 철학,
그리고 팀의 방향성을 전달하는 페이지로 다시 구성했습니다.

또한 각 섹션을 독립적인 컴포넌트 구조로 분리하여
페이지의 유지보수성과 확장성도 함께 고려한 구조로 정리했습니다.

서비스를 설명하는 페이지가 아니라
준비된사람들이 어떤 회사인지,
어떤 마음가짐으로 서비스를 운영하고 있는지를 보여주는
회사 소개 페이지로 전환하는 것이 이번 작업의 핵심이었습니다.

앞으로도 웹사이트의 각 페이지가
사용자에게 더 명확한 정보를 전달할 수 있도록
지속적으로 구조를 개선해 나갈 예정입니다.

이상으로

홈페이지 리뉴얼 시리즈를 마무리 하겠습니다.

감사합니다.

홈페이지 리뉴얼 ep.3 - Main 페이지 구성 개편(2)

gapsw2197 — Fri, 13 Mar 2026 10:41:43 +0900

4. ServiceFlowSection

ServiceFlowSection은 사용자가 실제로 서비스를 이용할 때
어떤 과정으로 진행되는지를 단계별로 보여주는 영역입니다.

서비스 이용 과정에 대한 문의가 자주 있었기 때문에
페이지 안에서 서비스 신청부터 이용 완료까지의 흐름을
한눈에 이해할 수 있도록 절차를 정리하여 구성했습니다.

또한 스크롤 진입 시 각 단계 카드가 순차적으로 등장하도록 애니메이션을 적용했습니다.

이 애니메이션은 CSS만으로 동작하는 것이 아니라
IntersectionObserver를 활용해 섹션이 화면에 들어왔을 때

애니메이션 클래스를 활성화하는 방식으로 구현했습니다.

초기에는 카드가 보이지 않는 상태로 시작하고,
섹션이 화면에 일정 비율 이상 나타나면 애니메이션이 실행되도록 구성했습니다.

.flowItemWrapper {
  opacity: 0;
  transform: translateY(20px);
}

@keyframes cardFadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

또한 animation-delay를 다르게 적용해
카드가 한 번에 나타나는 것이 아니라 서비스 절차 순서에 맞춰 자연스럽게 등장하도록 설계했습니다.

이를 통해 사용자가 단순히 정보를 읽는 것이 아니라
서비스 진행 흐름을 따라가듯 이해할 수 있도록 구성했습니다.

5. Appsection

AppSection은

준비된사람들 서비스를 모바일 앱을 통해 더욱 편리하게 이용할 수 있다는 점을 안내하는 영역입니다.

서비스 신청 및 이용 과정에서 앱 사용이 필수이기 때문에,
웹사이트에서 서비스를 확인한 사용자가 자연스럽게 모바일 앱으로 이어질 수 있도록 구성했습니다.

이 섹션에서는 App Store와 Google Play 스토어 버튼을 배치하여
사용자가 앱 마켓으로 바로 이동할 수 있도록 딥링크를 연결했습니다.

또한 실제 앱 화면을 캡처하여 스마트폰 목업 이미지에 적용함으로써
사용자가 앱을 통해 어떤 기능을 이용하게 되는지 직관적으로 이해할 수 있도록 구성했습니다.

왼쪽 화면은 앱의 메인 화면이며,
오른쪽 화면은 서비스 제공 시간 동안 동행 메이트가 작성한 메모를 보호자에게 전달하는
동행 과정 공유 기능 화면입니다.

이 기능을 통해 보호자는 서비스 진행 상황을 앱을 통해 확인할 수 있으며,
서비스 이용 과정이 어떻게 공유되는지 미리 이해할 수 있도록 했습니다.

6. PricingSection

PricingSection은 서비스 이용에 필요한 가격 정보를 전달하는 영역입니다.

기존과 비교해 가격 정책 자체에는 변화가 없지만,
사용자가 서비스 이용 전에 가격 구조를 보다 쉽게 이해할 수 있도록
가격 정보의 시각적 구성과 정보 구조를 개선했습니다.

요금 정보는 서비스 유형에 따라 동행 서비스와 일시재가 서비스로 구분하여
두 서비스를 한 화면에서 비교할 수 있도록 2열 레이아웃으로 구성했습니다.

이를 통해 사용자가 서비스별 가격 구조를 직관적으로 비교할 수 있도록 했습니다.

또한 가격 정보는 데이터 구조를 기반으로 정의하고
이를 테이블 형태의 UI로 렌더링하도록 구성하여
요금 정책 변경 시 유지보수가 용이하도록 구현했습니다.

const pricingData = {
  hospital: [...],
  homecare: [...]
};

이렇게 메인 페이지를 구성하는 각 섹션의 역할을 정리하고
서비스의 핵심 메시지, 이용 흐름, 가격 정보까지
사용자가 자연스럽게 이해할 수 있도록 페이지 구조를 다시 설계했습니다.

다음으로 고민해야 했던 것은

코드 구조였습니다.

기획된 6개의 섹션을 하나의 페이지에 모두 구현해야 했기 때문입니다.

기존 메인 페이지는 비교적 단순한 구조였기 때문에
하나의 Main.jsx 파일 안에 모든 UI를 구현하는 방식으로 작성되어 있었습니다.

하지만 이번 리뉴얼에서는
여러 개의 섹션이 추가되고
각 영역의 UI도 점점 복잡해졌기 때문에

모든 코드를 하나의 파일 안에 작성하는 방식은

유지보수 측면에서 좋은 구조가 아니었습니다.

그래서 메인 페이지를
섹션 컴포넌트 구조로 분리하기로 결정했습니다.

각 섹션을 독립적인 컴포넌트로 분리하여

각각의 파일에서 UI와 스타일을 관리하도록 구조를 변경했습니다.

<Main />
    <HeroSection />
    <PromiseSection />
    <ServiceSection />
    <ServiceFlowSection />
    <AppSection />
    <PricingSection />
</>

이렇게 구조를 나누면

• 특정 섹션의 UI를 수정할 때 다른 영역에 영향을 주지 않고 작업할 수 있고
• 새로운 섹션이 추가되더라도 메인 페이지 구조를 크게 수정하지 않아도 되며
• 코드 가독성과 유지보수성이 크게 개선됩니다.

결과적으로 Main.jsx는
각 섹션 컴포넌트를 조합하는 페이지 오케스트레이션 역할만 담당하도록 단순화되었습니다.

메인 페이지를 구성하는 각 영역이
독립적인 컴포넌트로 관리되면서 디버깅이 쉬워지고
향후 디자인 수정이나 기능 확장도 훨씬 수월하게 진행할 수 있게 되었습니다.

이번 메인 페이지 개편에서는
서비스의 핵심 정보를 더 명확하게 전달하기 위해
페이지의 정보 구조와 코드 구조를 함께 정리했습니다.

메인 페이지를 구성하는 각 영역을
독립적인 컴포넌트로 분리하면서
페이지의 유지보수성과 확장성 또한 함께 고려했습니다.

다음 글에서는
준비된사람들 서비스 알아보기 페이지 역할 재설계 과정에 대해
이야기해보려고 합니다.

홈페이지 리뉴얼 ep.3 - Main 페이지 구성 개편(1)

gapsw2197 — Fri, 13 Mar 2026 10:18:35 +0900

메인 페이지는 서비스의 첫인상을 만드는 중요한 공간입니다.

사용자는 메인 페이지에 들어온 뒤 몇 초 안에

• 어떤 서비스를 제공하는지
• 왜 이 서비스를 믿을 수 있는지
• 서비스를 어떻게 이용하면 되는지

를 이해하게 해야합니다.

기존 문제점

1. 서비스 핵심 정보 전달 부족

서비스가 무엇인지 한눈에 이해하기 어려웠고
서비스를 이용하려면 어떻게 신청해야 하는지에 대한 설명도 부족했습니다.

또한 히어로 섹션 하단에
시각적인 균형을 맞추기 위해 로고와 문장을 배치한

filler 성격의 콘텐츠가 일부 포함되어 있었습니다.

2. 서비스 신청의 한계

기존 메인 페이지에서는 서비스 신청을 위한 주요 CTA(Call To Action)가
명확하게 드러나지 않는 문제가 있었습니다.

특히 로그인 상태에서만 신청 버튼이 활성화되는 구조로 되어 있어
웹사이트를 처음 방문한 사용자 입장에서는
서비스를 어떻게 신청할 수 있는지 직관적으로 이해하기 어려웠습니다.

3. 다른 페이지에 존재하는 중복 정보

기존 메인 페이지에는
이미 다른 페이지에서 상세하게 설명되고 있는 내용이
일부 중복되어 배치되어 있었습니다.

이로 인해 메인 페이지의 정보 구조가 다소 모호해지고
사용자가 핵심 정보를 파악하기 어려운 문제가 있었습니다.

4. 서비스 설명 및 이미지 적절함 부족

기존 메인 페이지에서는
서비스 설명과 함께 사용되는 이미지가
실제 서비스 내용을 충분히 전달하지 못하고 있었습니다.

서비스의 특징이나 제공되는 도움의 범위가
시각적으로 잘 드러나지 않아 사용자가 서비스를 이해하기 어려운 부분이 있습니다.

새로운 구조 설계

기존 문제점에서 정리한 여러 이슈들을 해결하기 위해,

이번 리뉴얼은 단순한 UI 수정이 아니라 메인 페이지의 기획부터 다시 정리하는 작업으로 시작했습니다.
사용자가 홈페이지에 접속했을 때 가장 먼저 이해해야 하는 정보가 무엇인지 다시 정의했고,

그 우선순위에 따라 메인 페이지를 6개의 section으로 재구성했습니다.

HeroSection
PromiseSection
ServiceSection
ServiceFlowSection
AppSection
PricingSection

이제부터 각 section을 어떤 의도로 설계했고,

어떻게 구현했는지 하나씩 정리해보겠습니다.

1. HeroSection

메인 페이지에서 사용자가 가장 먼저 마주하게 되는 영역이 바로 HeroSection입니다.
따라서 이 섹션은 사용자가 웹사이트에 접속했을 때 서비스의 핵심 메시지를 가장 먼저 이해할 수 있도록 설계했습니다.

히어로 섹션의 시작은 준비된사람들이 전달하고자 하는 핵심 메시지인 "따뜻한 동행’이라는 문구로 구성했습니다.
사용자가 페이지에 들어왔을 때 서비스의 성격과 방향성을 직관적으로 느낄 수 있도록 메시지를 가장 상단에 배치했습니다.

또한 페이지 첫 화면이 지나치게 정적으로 보이지 않도록
텍스트와 이미지 카드에는 간단한 등장 애니메이션을 적용했습니다.

애니메이션은 CSS 기반으로 구현하여 페이지 로딩 시 콘텐츠가 자연스럽게 나타나도록 구성했습니다.
특히 transform과 opacity 속성을 활용한 애니메이션을 사용하여 브라우저 렌더링 성능에 부담을 주지 않도록 설계했습니다.

.heroText {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeUp 0.8s ease-out forwards;
}

@keyframes fadeUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

이러한 방식으로 텍스트와 이미지가 순차적으로 등장하도록 구성하여
사용자의 시선이 자연스럽게 핵심 메시지로 향하도록 했습니다.

또한 기존 문제점에서도 언급되었던 서비스 신청 버튼 구조도 함께 개선했습니다.
기존에는 로그인 상태에서만 신청 버튼이 활성화되는 구조로 되어 있어
사용자가 서비스 신청 경로를 직관적으로 이해하기 어려운 문제가 있었습니다.

이번 리뉴얼에서는 로그인 여부와 관계없이
히어로 섹션과 상단 메뉴에서 항상 신청 페이지로 이동할 수 있도록 CTA 구조를 수정했습니다.

이를 통해 사용자가 웹사이트 어디에서든
서비스 신청 흐름을 쉽게 인지할 수 있도록 개선했습니다.

2. PromiseSection

PromiseSection은
준비된사람들이 어떤 마음과 방향성으로 서비스를 운영하고 있는지,
서비스의 철학과 신뢰 메시지를 전달하기 위한 영역입니다.

이 섹션에서는 고객에게 우리가 어떤 태도로 서비스를 제공하는지,
그리고 왜 준비된사람들을 선택해야 하는지에 대한
차별점과 근거를 전달하는 데에 집중했습니다.

특히 ‘태도가 프리미엄입니다’라는 문구와
따뜻한 눈길을 마주하는 이미지를 통해
고객이 서비스를 이용하기 전에
준비된사람들이 지향하는 태도를 미리 느낄 수 있도록 구성했습니다.

3. ServiceSection

PromiseSection에서 준비된사람들이 어떤 태도와 기준으로 서비스를 운영하는지 전달했다면,
ServiceSection에서는 실제로 어떤 서비스를 제공하는지 구체적으로 설명하는 역할을 합니다.

사용자가 서비스를 이용하기 전에
어떤 서비스를 선택할 수 있는지, 그리고 어떤 도움을 받을 수 있는지를
직관적으로 이해할 수 있도록 구성했습니다.

두 서비스를 하나의 화면에서 비교하면서 확인할 수 있도록
좌측에서는 서비스 유형을 선택하고 우측에서는 해당 서비스의 상세 내용을 확인하는
구조로 설계했습니다.

ServiceSection은 사용자가 서비스 유형을 선택하면
오른쪽 영역의 설명과 이미지가 함께 변경되는 상태 기반 UI로 구현했습니다.

React의 state를 활용하여 선택된 서비스에 따라
해당 서비스의 콘텐츠가 동적으로 렌더링되도록 구성했습니다.

const [selectedService, setSelectedService] = useState("hospital");

이를 통해 페이지 이동 없이
하나의 섹션 안에서 두 가지 서비스를 비교하면서 확인할 수 있도록 했습니다.

또한 각 서비스에서 제공되는 업무 범위는
Accordion UI를 활용하여 구성했습니다

const [openIndex, setOpenIndex] = useState(null);

const toggleAccordion = (index) => {
  setOpenIndex(openIndex === index ? null : index);
};

. 기본적으로는 핵심 항목만 노출하고
사용자가 필요할 때 세부 내용을 펼쳐볼 수 있도록 하여
한 화면에 너무 많은 정보를 노출하지 않으면서도
필요한 정보를 단계적으로 확인할 수 있도록 설계했습니다.

ServiceFlowSection
AppSection
PricingSection

남은 3가지 섹션의 수정 사항에 대해서는

다음 Main 페이지 구성 개편(2)의 이야기로 가져오겠습니다!

홈페이지 리뉴얼 ep.2 - '문의하기' 페이지

gapsw2197 — Thu, 12 Mar 2026 10:05:09 +0900

B2C 비즈니스에서 개발자의 중요한 역할 중 하나는
고객이 서비스로 들어올 수 있는 통로를 만드는 것이라고 생각합니다.

그중에서도 고객이 서비스에 대해 궁금증이 생겼을 때
그 궁금증을 빠르게 해결할 수 있도록 만드는 일은 매우 중요합니다.

궁금증이 생겼다는 것 자체가 이미 서비스에 대한 인지가 생겼다는 의미이기 때문입니다.

그 과정에서 이용을 가로막는 작은 장애물들을 해결해 준다면
그 고객은 서비스를 이용할 가능성이 가장 높은 후보가 될 수 있습니다.

하지만 기존 문의하기 페이지는
필요한 정보를 찾거나 문의를 남기기까지의 흐름이
조금 매끄럽지 않다고 느껴졌습니다.

특히

FAQ 영역의 가독성이 떨어진다는 점
문의 작성 시 입력 경험이 직관적이지 않다는 점

이 두 가지가 주요 문제였습니다.

그래서 이번 리뉴얼에서는 문의하기 페이지의 기능 자체는 유지하면서

인라인 스타일 중심 구조를
컴포넌트 기반 구조 + 접근성 + 폼 UX + 반응형 UI 중심으로
리팩토링하기로 했습니다.

이번 글에서는 FAQ와 문의하기 섹션에서

기존 문의 페이지의 문제
어떤 UX 개선을 진행했는지

두 가지를 중심으로 이야기해보겠습니다.

1. FAQ part UI/UX

[기존 문의 페이지의 문제]

1. 명확하지 않는 질문과 답변 구획

기존 FAQ는 질문과 답변의 구획이 명확하게 나뉘지 않아
여러 항목이 하나의 흐름처럼 이어져 보이는 문제가 있었습니다.

제목과 답변이나 항목들의 색상차이로 구분하지만 명확하지 않아

사용자가 각 질문을 구분해 읽기 어렵고
전체적으로 가독성이 떨어지는 구조였습니다.

2. 자꾸 닫히는 질문 카드

또한 기존 FAQ에서는 질문(Q)을 클릭하면 답변(A)이 열리지만,
답변 영역을 클릭하면 FAQ가 다시 닫히는 구조였습니다.

이 때문에 사용자가 답변을 읽는 도중에도
의도치 않게 FAQ가 닫히는 경험이 발생할 수 있었고,
사용자 경험 측면에서 불편함이 있었습니다.

[개선 방향]

이번 리뉴얼에서는 FAQ의 구조와 인터랙션을 함께 개선했습니다.
먼저 각 질문을 카드 형태로 분리하여 항목 간 경계를 명확하게 만들었고,
마우스를 올리면 hover 효과가 나타나도록 하여
사용자가 선택 가능한 질문을 직관적으로 인지할 수 있도록 했습니다.

.faqRow:hover {                                                                                                                  
    background: rgba(111, 43, 127, 0.06);                                                                                          
  } 
  .faqRow:hover .faqTitleText {                                                                                                    
    color: #different color;                                                                                                                
  }

또한 FAQ를 아코디언 구조로 개선하여
질문(Q) 영역을 클릭했을 때만 답변이 열리고 닫히도록 수정했습니다.
이를 통해 답변을 읽는 중에 실수로 닫히는 문제를 방지했습니다.
아울러 현재 열려 있는 항목은 화살표 방향과 스타일 변화를 통해
사용자가 상태를 쉽게 확인할 수 있도록 했습니다.

#변경 전에는 바깥 div 전체에 onClick={() => toggleContent(index)},질문 영역이든 답변 영역이든 같은 카드 안을 클릭하면 닫힘                                                                                                                                                                
  <div                                                                                                                                                    
    key={index}
    ...                                                                                                                                                   
    onClick={() => toggleContent(index)}                                                                                                                  
  >                                                                                                                                                       
    ...                                                                                                                                                                                                                                                                        
      <div                                                                                                                                                
        className={styles.faqContent}                                                                                                                                                                                                                   
      ></div>                                                                                                                                             
    )}                                                                                                                                    
  </div>                                                                                                                                                  
                                                                                                                                                          
  #변경 후에는 onClick이 faqRow에만                                                                                                                                                                                                                                                    
  <div                                                                                                                                                    
    key={index}                                                                                                                               
    className={`${styles.faqItem} ${isOpen ? styles.faqItemOpen : ""}`}                                                                                   
  >                                                                                                                                                       
    <div                                                                                                                                                  
      className={styles.faqRow}                                                                                                                           
      onClick={() => toggleContent(index)}                                                                                                                
    >

 #답변 영역 클릭이 부모로 전파되지 않도록
  <div
    className={styles.faqContent}
    onClick={(e) => e.stopPropagation()}
  />

마지막으로 기존에는 첫 번째 질문이 기본적으로 열려 있었지만,
이번 리뉴얼에서는 모든 질문이 닫힌 상태에서 시작하도록 변경하여
사용자가 필요한 질문만 선택해 확인할 수 있도록 구성했습니다.

  #변경 전
  const [expandedIndex, setExpandedIndex] = useState(0);

  #변경 후
  const [expandedIndex, setExpandedIndex] = useState(null);

2. 문의하기 part UI/UX

Before

[기존 문의 페이지의 문제]

1. 작은 글자 크기와 입력 영역의 낮은 가독성

기존 문의 페이지는 전반적으로 글자 크기가 작고
입력 필드 또한 최소한의 라인 형태로 구성되어 있어
문의 내용을 읽고 작성하는 과정에서 가독성이 충분하지 않았습니다.

특히 준비된사람들 서비스는
어르신 보호자나 중장년 사용자가 많이 이용하기 때문에
텍스트의 크기와 입력 영역의 명확성은
사용자 경험에 중요한 요소라고 판단했습니다.

2. 문의 작성 영역의 시각적 구분 부족

또한 기존 UI는 입력 필드가 라인 형태로 구성되어 있어
사용자가 어디에서 내용을 입력해야 하는지
시각적으로 한 번 더 확인해야 하는 불편함이 있었고
전체적으로 문의 작성 화면이 다소 단조롭게 느껴지는 구조였습니다.

3. 문의 전 확인할 수 있는 안내 정보 부족

기존 문의 페이지에서는
단순히 이메일과 전화번호만 안내되어 있어
사용자가 문의를 남기기 전에 참고할 수 있는 정보가 부족했습니다.

예를 들어 문의 가능 시간이나 예상 응답 시간과 같은 안내가 없어
고객 입장에서 언제 답변을 받을 수 있는지
미리 파악하기 어려운 부분이 있었습니다.

After

[개선 방향]

이번 리뉴얼에서는 문의 페이지의 가독성과 사용성을 함께 개선하는 방향으로 구조를 정리했습니다.
먼저 전반적인 텍스트 크기와 입력 필드의 크기를 확대하여
사용자가 내용을 더 쉽게 읽고 입력할 수 있도록 개선했습니다.
또한 기존에는 단순한 라인형 입력 스타일을 사용하고 있었지만,
리뉴얼 이후에는 카드형 UI를 적용해
문의 작성 영역이 하나의 명확한 공간으로 인식되도록 구성했습니다.
입력 필드의 포커스 상태, 버튼의 활성/비활성 상태,
그리고 hover 인터랙션을 추가하여
사용자가 현재 입력 상태를 직관적으로 인지할 수 있도록 했습니다.
마지막으로 문의 페이지에 고객 안내 정보를 새롭게 추가했습니다.
기존에는 이메일과 전화번호만 안내되어 있었지만,
이번 리뉴얼에서는 문의 가능 시간과 예상 응답 시간 등의 정보를 함께 제공하도록 개선했습니다.
이를 통해 사용자가 문의 전에 필요한 정보를 미리 확인하고,
보다 편안하게 문의를 남길 수 있는 환경을 만들고자 했습니다.

3. 반응형 UI/UX

모바일 환경에서도 편하게 사용할 수 있도록
반응형 레이아웃을 강화했습니다.

900px 기준 미디어쿼리를 적용해

• FAQ 레이아웃
• 입력 폼 간격
• 버튼 크기
• 텍스트 가독성

등을 모바일 화면에 맞게 조정했습니다.

이를 통해 스마트폰에서도

문의 페이지를 보다 편하게 사용할 수 있도록 개선했습니다.

문의 페이지는 단순히 메시지를 보내는 기능이 아니라
고객이 서비스와 처음으로 직접 연결되는 중요한 접점입니다.

이번 리뉴얼을 통해 고객이 궁금한 정보를 빠르게 확인하고
필요할 때 부담 없이 문의를 남길 수 있는 경험을 만드는 데 집중했습니다.

앞으로도 준비된사람들 웹사이트는
사용자 경험을 중심으로 지속적으로 개선해 나갈 예정입니다.

광주광역시 병원동행 '준비된사람들', 규제 샌드박스로 차량 이용이 가능해졌습니다.

readypeople — Wed, 11 Mar 2026 18:48:42 +0900

광주광역시 병원동행, 준비된사람들

안녕하세요.

프리미엄 동행서비스 플랫폼,

준비된사람들입니다.

준비된사람들은 항상 고객의 목소리에 귀 기울이며

어르신들이 더 편리하게 병원을 이용할 수 있도록,

그리고 보호자분들이 더 마음 놓일 수 있도록

서비스를 고민하고 개선해 나가고 있습니다.

서비스를 제공하면서

저희가 계속 고민했던 문제 중 하나가 바로

병원 이동 시 차량 이용 문제였습니다.

어르신들과 병원에 동행할 때

대부분 택시를 이용해 이동하게 됩니다.

하지만 현실에서는 여러 어려움이 있습니다.

광주광역시 병원동행 준비된사람들

출퇴근 시간과 겹치면

택시가 잡히지 않는 경우가 많고,

휠체어나 보행 보조기 등을 가지고 이동해야 하는 경우에는

택시 기사님이 탑승을 거절하는 상황도 종종 발생합니다.

이러한 상황은

어르신에게도, 보호자에게도

큰 불편과 걱정으로 이어질 수 있습니다.

그래서 저희는

요양보호사가 직접 차량을 이용해

어르신과 병원에 동행할 수 있는 방법을 고민했습니다.

하지만, 여기에는 또 다른 장벽이 있었습니다.

요양보호사가 자신의 차량을 이용해

어르신을 이동시키는 경우

여객자동차운수사업법에 따라

불법으로 간주될 수 있는 규제가 있었기 때문입니다.

그래서 저희는

이 문제를 해결하기 위해

규제 샌드박스 제도에 도전하게 되었습니다.

광주광역시 병원 동행 준비된사람들

먼저 규제 샌드박스에 대해 간단히 설명드리겠습니다.

규제 샌드박스는

새로운 제품이나 서비스가 등장했을 때

기존 규제로 인해 시장에서 시도조차 하지 못하는 상황을 막기 위해

일정 기간 동안

규제를 면제하거나 유예해 주는 제도입니다.

쉽게 말해, 기존 규제가 있더라도

일단 서비스를 시험적으로 운영해 볼 수 있도록 허용하는 제도라고

이해하시면 됩니다.

준비된사람들은

국토교통부로부터 규제 샌드박스 확인을 받았습니다.

광주광역시 병원동행 준비된사람들

이를 통해 앞으로 사업개시일로부터 24개월동안

저희 회사에서 운영하는 특수 개조 차량을 이용해

광주광역시와 전라남도 지역에서

어르신을 병원까지 안전하게 이동시키는

병원동행서비스를 제공할 수 있게 되었습니다.

이는 단순히 차량 이동 서비스가 아니라

어르신들이 더 안전하고 편안하게 병원을 이용할 수 있는 환경을

만들기 위한 중요한 첫걸음입니다.

하지만 아직 해야 할 일은 많습니다.

특수 차량 개조부터 시작해

차량 운영 시스템 구축, 전용주차 공간 확보, 보험 가입, 인력 교육까지

준비하고 만들어가야 할 과정이 많이 남아 있습니다.

그럼에도 불구하고

이 모든 수고가 어르신들의 편의와

보호자 분들의 평안을 위하는 일이라면

기꺼이 감내할 수 있습니다.

앞으로도 준비된사람들은

어르신과 보호자 모두가 안심할 수 있는

동행 서비스를 만들기 위해 끊임없이 고민하고

발전해 나가겠습니다.

준비된사람들을 함께 기대해주세요.

지금까지 준비된사람들이었습니다.

062-222-3650

0507-1308-6724

광주광역시 병원동행 준비된사람들

홈페이지 리뉴얼 ep.1 - '이용 후기' 페이지

gapsw2197 — Wed, 11 Mar 2026 09:01:38 +0900

'이용후기'인 실제 고객의 리뷰 페이지를

처음 열어보는 고객은 두 가지를 확인시켜야 한다.

정말 믿을 만한 서비스인지
다른 사람들은 어떤 경험을 했는지

하지만 기존 구조로는 이 두 가지를 충분히 전달하지 못했다.
그래서 이용후기 페이지를 고객이 후기를 ‘경험할 수 있는 공간’으로 만들기 위해 리뉴얼하기로 했다.

이번 글에서는

1) 왜 수정했는가,

2) 어떻게 수정했는가에 대해 이야기하려 한다.

1) 왜 수정했는가

1. 진정성 있는 후기가 묻혀버리는 문제

동행 서비스가 종료되면 고객들은 리뷰를 작성할 수 있다.

리뷰는 아직 서비스를 경험해보지 못한 잠재 고객에게 실사용자의 경험을 그대로 전달해 주는 가장 좋은 매개체다.

서비스 특성상, 가족의 병원 동행이나 재가 서비스를 의뢰하는 경우가 많기 때문에,

잠재 고객은 “다른 가족들은 어떤 경험을 했는지”가 가장 궁금할 것이다.

그렇기에 후기 하나가 광고 여러 개보다 설득력이 높을 수밖에 없다.

특히 그중에는 서비스 진행 과정, 느꼈던 감정, 동행메이트에 대한 감사 등을 자세하게 적어주신 장문의 후기가 있다.

이런 후기들은 준비된사람들을 처음 알게 된 사람에게 큰 신뢰를 줄 수 있는 소중한 자산이다.

그런데 기존 UI에서는 이 중요한 후기들이 단순히 시간 순으로만 정렬되어, 짧은 리뷰들과 똑같은 레벨로 섞여 노출되고 있었다.

그 결과, 진심이 담긴 후기의 가치가 눈에 잘 띄지 않고 쉽게 지나쳐지는 문제가 발생했다.

2. 개인정보 보호 이슈

이용후기에는 동행을 수행한 동행메이트의 이름과 프로필 사진이 함께 노출된다.
하지만 동행메이트는 실명과 얼굴이 드러나는 순간,
개인정보 보호 측면에서 불필요한 노출 위험을 안게 된다.

기존 구조는 이 부분에 대한 고려가 충분하지 못해서,
서비스 신뢰도와는 별개로, 개인정보 보호 정책 측면에서 개선이 필요하다고 판단했다.

3. 3열 구조의 한계

기존 후기 페이지는 3열 그리드 구조로 되어 있었다.
처음에는 많은 후기를 한 화면에 보여줄 수 있어 좋아 보였지만, 실제 사용성에서는 다른 문제가 드러났다.

글이 길어질수록 줄바꿈이 어색하게 보이고
눈이 화면을 좌→우로 여러 번 왔다 갔다 하면서 시선 흐름이 불편하고
특히 장문 후기가 잘 읽히지 않아 또다시 묻히는 구조가 되어 버렸다.

결국, “후기를 강조하고 싶어서 만든 페이지인데,
정작 후기가 잘 읽히지 않는” 아이러니한 상황이 된 것이다.

이런 문제들을 해결하기 위해,
이용후기 페이지는 단순한 디자인 수정이 아니라 구조 자체를 다시 설계해야 하는 대상이 되었다.

2) 어떻게 수정했는가

1. ‘베스트 댓글’ 전용 영역 신설

고객의 경험이 자세하게 담긴 후기, 동행메이트에 대한 감사가 진하게 느껴지는 후기 등

서비스의 가치를 가장 잘 보여주는 후기를 선별해 ‘베스트 댓글’ 섹션으로 따로 분리했다.

이 영역은 페이지 상단에 배치하고, 한 카드에 더 넉넉한 공간을 줘서 가장 먼저, 가장 크게 눈에 들어오도록 설계했다.

2. 개인정보 보호를 위한 안전한 정보 노출

이용후기에는 동행메이트의 이름이 함께 노출된다.
하지만 실명을 그대로 보여줄 경우, 개인이 불필요하게 식별될 수 있는 위험이 있다.

그래서 이름은 첫 글자만 보여주고, 나머지는 별표로 처리하는 방식으로 바꿨다.
실제 화면에서는 아래와 같은 형태로 렌더링된다.

<b className={styles.praise}>
  <span className={styles.helperName}>
    {review?.helper?.name?.charAt(0)}**
  </span>
  님을 칭찬해요
</b>

name.charAt(0)으로 이름의 첫 글자만 사용하고 뒤에는 **를 붙여 '박**님'처럼 표현한다.

이렇게 하면 고객 입장에서는
“어떤 메이트를 칭찬하고 있는지” 감각적인 느낌은 유지되면서도,
실제 개인이 누구인지 특정되지는 않도록 개인정보를 안전하게 보호할 수 있다.

3. 후기 레이아웃 재구성 (베스트 1열 + 일반 2열)

후기 가독성을 최우선으로 두고 레이아웃을 재설계했다.

기존 리뷰 리스트는 다음과 같은 CSS로 구성돼 있었다.

Before:

.reviewList {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
}

After:

.bestGrid {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 10px;
}

.reviewList {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 18px;
}

베스트 댓글: 1열
→ 장문 후기를 자연스럽게 읽을 수 있도록 한 줄 한 줄 흐름을 살린 구조
일반 후기: 2열 그리드
→ 정보량은 유지하면서도 안정적인 시선 흐름 확보

이를 위해 CSS 그리드/플렉스, 카드 여백, 글씨 크기, 줄 간격 등을 전면적으로 조정했고,
React 컴포넌트 구조 또한 베스트/일반 영역을 분리하여 재정리했다.

그 결과, 스크롤을 내리며 읽었을 때 내용이 눈에 잘 들어오고 진짜 고객의 감정이 자연스럽게 전달되는 페이지로 개선되었다.

3-1. 로딩 경험 개선: Skeleton + 부드러운 등장 애니메이션 + 호버 효과

리뉴얼의 핵심 목표 중 하나는
고객이 후기를 읽는 동안 “끊김 없이 자연스러운 경험”을 제공하는 것이었다.

기존 리뷰 페이지에서는 API 응답이 늦어질 경우,
화면에 텅 빈 영역이 그대로 노출되어 사용자가 순간적으로 “버그인가?” 혹은 “후기가 없나?”라고 오해할 가능성이 있었다.

이 문제를 해결하기 위해 두 가지 기술적 접근을 적용했다.

1) Skeleton UI (Shimmer 로딩) 도입

Skeleton UI 예시 ❘ 출처: https://yeon-design.tistory.com/51

후기 데이터를 불러오는 동안
placeholder 형태의 스켈레톤 박스가 먼저 렌더링되도록 했다.
특히 단순한 회색 박스가 아니라, 빛이 스르륵 지나가는 듯한 shimmer 애니메이션을 적용해
기다리는 시간의 답답함을 최소화했다.

적용된 CSS

@keyframes shimmer {
  0%   { background-position: 100% 0; }
  100% { background-position: -100% 0; }
}

.bestSkeleton,
.reviewSkeleton {
  background: linear-gradient(90deg, #f2f2f2 25%, #eaeaea 37%, #f2f2f2 63%);
  background-size: 400% 100%;
  animation: shimmer 1.4s infinite;
  border-radius: 16px;
}

.bestSkeleton { height: 160px; }
.reviewSkeleton { height: 140px; }

2) 후기 등장 시 자연스러운 Fade-up 애니메이션

로딩이 끝나고 실제 후기가 나타날 때,
갑자기 툭 튀어나오는 대신
아래에서 위로 살짝 떠오르며 나타나는 fade-up 효과를 적용했다.

적용된 CSS

@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.reviewCard {
  animation: fadeUp 0.35s ease both;
}

마무리

서비스에 궁금증을 가지고 있는 고객들이
실제 이용자들의 경험을 통해 서비스를 간접적으로 느낄 수 있도록
이용후기 페이지의 UI/UX를 수정했습니다.

아직 많은 레퍼런스나 다양한 개발 경험을 가지고 있는 것은 아니지만,
현재 제가 할 수 있는 범위 안에서

사용자가 조금 더 쉽게 이해하고 신뢰할 수 있는 경험을 만들기 위해 고민하며 개선을 진행했습니다.

앞으로도 준비된사람들의 웹사이트는
사용자가 서비스를 이해하고 편하게 이용할 수 있는 경험을 가장 중요한 기준으로 삼아
지속적으로 개선해 나가려고 합니다.

혹시 이 글을 읽어주신 분들 중에서
좋은 아이디어나 개선하면 좋을 부분이 보인다면
언제든지 편하게 의견을 나눠주시면 감사하겠습니다.