ThemeIsle 재 설계 : 진행 방식 및 비용

테마 섬 재 설계


나는 버즈 킬을 싫어하지만 재 설계의 팬은 아닙니다. 몇 년에 한 번씩 사이트를 변경하고 사이트를 새로 고치는 데 흥분을 느끼고 많은 사람들이 왜 그런 일을 좋아하는지 이해합니다..

제 생각은 항상 디자인이 필요하다는 것입니다 "충분하다," 그리고 그것은 위대한 사물의 제도에서 큰 차이를 만들지 않을 것입니다..

그러나 그렇게 말하면 ThemeIsle은 오랫동안 변경 기한이 지났습니다. 심지어 나는 더 이상 2019 년 준비가되어 있지 않다는 것을 알 수있었습니다. 그래서 일을 흔들기로 결정했을 때, 나는 우리가 가능한 한 많은 변화로부터 배울 수 있도록 과정을 문서화했습니다..

이제는 새로운 ThemeIsle 디자인이 시작되었습니다 이전 디자인, 내린 결정, 새로운 디자인을위한 목표, 디자인이 어떻게 진행되었는지 다시 살펴 보겠습니다..

바로 가기 :

  • 오래된 디자인에 대한 �� 생각
  • �� 새로운 디자인이 들어옵니다
  • �� 새로운 웹 사이트 구조
  • �� 방문 페이지 및 모바일 개선

구 테마 아일 디자인과 그 문제 ��

1. 디자인 자체의 문제점

솔직히, 나는 ThemeIsle의 독창적 인 디자인이 나쁜 것으로 보지 못했습니다. 제 생각에는 그것이 좋지 않다는 것을 알고 있었지만 (결국 눈에 들어갔습니다.) 그것이 브랜드에 영향을 미치거나 판매에 부정적인 영향을 줄 수있는 문제라고 생각하지 않았습니다.

또한, 사이트가 시작된 지 얼마되지 않았으며, 초기에는 디자인이 다른 것과 비슷한 수준이었습니다..

그러나 수년에 걸쳐 우리는 많은 A / B 테스트, 기타 소위 개선, 다양한 SEO 조정 등을 시작했으며, 최고의 디자인 벤치 마크 나 컨트롤이 없었기 때문에 사이트의 일관성이 떨어졌습니다. 예를 들어 ShopIsle 테마에 대한이 일반 페이지와 RokoPhoto에 대한이 사용자 정의 페이지가 있습니다.

shopisle vs rokophoto

하루가 끝나면 디자이너에게 판매하는 것이 우리가 확장하려는 분야이기 때문에 더 세련된 디자인은 브랜드를 조금 강화하고 더 많은 버즈를 생성 할 수 있음을 깨달았습니다..

그것이 사이트를 정밀 검사하는 주된 이유였습니다..

2. 웹 사이트 구조 및 사업 모델

이것은 나를 가장 귀찮게 한 것 중 하나였습니다. 우리가 처음 웹 사이트를 시작하고 만들었을 때, 그것은 테마 클럽이되어야했습니다. 우리는 10-20 개의 테마를 가졌으며 패키지로 판매하고 싶었습니다. 매우 간단합니다.

당시에는 지원 포럼도 있었고 메인 사이트를 시작한 후 새 집이 필요한 플러그인을 발견했습니다. 좋은 거래 였으므로 우리는 그것을 보드에 가져 와서 주요 제안에도 던졌습니다. 테마 패키지의 일부로 사용하는 것은 그다지 의미가 없었지만 당시 우리가 할 수 있다고 생각한 것이 가장 좋았습니다. ��‍♂️

지난 5 년 동안 시장은 변화했으며 더 이상 20 가지 테마를 구축하고 유지할 필요가 없다는 것을 이해했습니다. 또한 누군가가 기대하는 것이 아닙니다. 우리는 시대에 "주력 테마" – 상점이 하나의 기본 테마 또는 몇 가지 테마를 제공 한 다음 추가 업그레이드 또는 디자인 패키지를 제공하는 경우.

우리는 비슷한 길을 따르기로 결정하고 2 ~ 3 개의 테마로 작업했습니다. 플러그인과 동일.

또한 개별 제품 브랜드가 더 강력하고 잠재력이 더 크다는 것을 알게되었습니다 "주요 사이트 브랜드," 그것들을 강조하는 것이 더 합리적입니다. X 테마와 Themeco 생각.

더 기여하는 요소는 ThemeIsle 블로그. 지난 5 년 동안 크게 성장했으며 처음 시작했을 때 불가능하다고 생각했던 시장 위치를 ​​확보 할 수있었습니다..

3. 우리의 기술 부채

여기서 이야기하고 싶은 두 가지 :

a) 웹 사이트 속도

기존 사이트에는 많은 레거시 요소와 기술이 자리 잡고있었습니다. 우리는 손으로 만든 시스템을 사용하여 사이트를 통해 직접 제품을 판매하기 시작했습니다..

사이트 엔진이 여러 차례 반복되어 시간이 지남에 따라 관리하기 어려운 수많은 ACF 필드가 발생했습니다. 우리는 또한 포럼을 운영하고, 제휴 프로그램을 주최하고, 문서를 주최하고, 다른 많은 것들을 주최했습니다.

전반적으로 구조가 매우 효율적이지 않아서 성능이 상당히 떨어졌습니다..

참고로, 이후 FastSpring으로 전환했으며 더 이상 자체 판매를 처리하지 않습니다. 우리는 다른 시스템 중 일부를 비슷하게 제거했지만 많은 시스템이 여전히 존재했습니다..

b) 쇼핑 카트 구조

비즈니스의 특성 – 여러 제품과 개별 브랜드가 모기업의 브랜드보다 더 많이 성장할 수 있기 때문에 실제 기술 구성을 분할 할 때가되었다는 것을 깨달았습니다..

특히 고객 데이터를 프런트 엔드 부분 (테마 목록 및 저자 및 콘텐츠와 모든 마케팅 노력)에서 분리하는 것이 좋습니다. 이런 식으로 프론트 사이트 속도는 EDD와 같은 플러그인이나 백그라운드에서 비즈니스를 운영하기 위해 진행되는 다른 플러그인의 영향을받지 않습니다..

마케팅 팀은 또한 사이트를보다 효과적으로 제어 할 수 있으며, 통일 된 고객 영역을 매장에 유지하면서 제품에 대해 별도의 사이트 / 브랜드를 설정할 수 있습니다..

4. 방문 페이지 및 모바일

우리가 원래 사이트를 시작했을 때 실제로는 모바일이 아니 었습니다. 특히 우리의 틈새 시장에서는 누구도 전화로 테마를 구매하는 것이 거의 없었습니다. 지금도 모바일 고객은 거의 없습니다.

그럼에도 불구하고 모바일의 중요성이 커지고 있으며 이러한 추세는 계속 될 것으로 보입니다. 결국 Google은 이제 데스크톱 크롤러보다 모바일 크롤러를 사용합니다..

간단히 말해 Google은 최고의 제품을위한 맞춤 방문 페이지를 구축하고 전환율을 높이기로 결정했습니다. 모바일은 페이지를 모바일 용으로 만들뿐만 아니라 AMP와 호환되도록 설정했기 때문에 모바일이 중요합니다..

새로운 ThemeIsle 디자인이 등장합니다

좋아, 무대 세트와 나의 추론이 설명 되었으니, 이제 모든 것이 어떻게 진행되는지 봅시다..

1. 디자인과 미학

이것은 당신이 스스로 판단 할 수 있지만, 나에게 이것은 절대적인 성공이었습니다.!

이전 디자인은 다음과 같습니다.

테마 아일랜드 디자인

그리고 여기 새로운 것이 있습니다 :

테마 아일 새로운 디자인

웹 사이트는 훨씬 더 일관성 있고 유쾌하게 보입니다. 존 프라 스코 AnalogWP 디자인을 만들었습니다. 일반적으로 우리를 위해 만화를 제작하는 João Santos는 몇 가지 맞춤 삽화를 만들었습니다. 그리고 마지막으로, 카탈린 바 실레, 오리지널 ThemeIsle 디자이너, 새로운 로고 작업.

이 부분만으로도 약 $ 10,000- $ 15,000의 비용이 들었습니다. 디자인 자체는 ROI를 추적하기가 거의 불가능하지만 투자 가치가 있다고 생각합니다. 솔직히 사이트를 재 설계하기로 결정하는 데 5 년이 걸렸다는 점을 고려하면 비용은 수익의 0.5 % 미만에 불과합니다. 이로 인해 결과가 거꾸로되면 프로젝트를 쉽게 가치있게 만들 수 있습니다.!

2. 새로운 웹 사이트 구조

새로운 구조를 도입하면 복잡성이 약간 증가했지만 최고의 제품으로의 트래픽을 증가 시켰으며 이는 항상 좋은 일입니다. 단점은 테마 카테고리에 대한 트래픽이 감소한 것입니다. 하지만 괜찮습니다.

여기서 가장 중요한 것은 ThemeIsle이되고 싶지 않다는 것입니다. "테마 장소," 그러나로 알려진 "Neve and Hestia 제작자."

이를 위해 Google은 해당 제품을 홈페이지, 테마 페이지에 게재하고 일반 가격 책정 페이지를 완전히 삭제하기로 결정했습니다. 또한 제품에 대한 개별 로고를 만든 다음 인기 제품에 대한 고유 한 방문 페이지 (자체 브랜딩 및 모두 포함)를 만들기 시작했습니다. 또한, 우리는 개별 브랜드를 강조하기 위해 여기 저기 몇 가지를 조정했습니다..

전과 후의 헤스티아

3. 기술 부채 해결

다시, 두 가지 :

a) 웹 사이트 속도

로딩 시간이 50 % 단축되었습니다. 그러나 우리는 그 과정에서 어려움을 겪었습니다.

자체 제품을 사용하고 개발자가 익숙하지 않은 새로운 블록 편집기를 사용하도록하기 위해 웹 사이트 구축 환경을 완전히 망쳤습니다..

구텐베르크는 아직 존재하지 않거나 적어도 우리가 사용했던 방식이 도움이되지 않습니다. 여전히 방문 페이지를위한 최선의 선택은 아니며, 속도를 원한다면 직접 제작 한 구조의 ACF에 의존하는 것이 좋습니다. 다른 무엇보다 유연성을 선호하는 경우 홈페이지에서 한 것처럼 Beaver Builder 또는 Elementor를 사용할 수 있습니다..

성능을 염두에두고 웹 사이트를 구축 할 때는 여전히 쉬운 일이 아닙니다. 플러그인을 사용하여 모든 문제를 해결할 수는 없으며 스스로 많은 일을해야합니다. 재 설계 프로젝트의 수석 개발자 인 Cosmin Serbanescu의 의견입니다.

코스 민

ThemeIsle 웹 사이트 재 설계 작업을하게되어 정말 기뻤습니다. 제가 작업했던 가장 복잡하고 까다로운 프로젝트 중 하나입니다..

아마도 가장 까다로운 부분은 처음부터 속도 중심의 접근 방식으로 인해 타사 플러그인이나 불필요한 라이브러리없이 기능이나 웹 사이트 섹션을 구현하기 전에 최소한 두 번 생각해야했으며 코드를 깨끗하게 유지해야한다는 것입니다 가능한.

b) 새로운 쇼핑 카트 구조

이 부분은 이제 모든 것이 store.themeisle.com에 설정되었으므로 매우 순조롭게 진행되었습니다..

물론, 이런 것들과 평소와 같이, 우리는 시작일에 약간의 어려움에 직면했지만, 제 시간에 그것을 알아낼 수있었습니다..

앞에서 언급했듯이이 설정에서는 모든 고객 / 사용자 데이터가 프론트 엔드와 별도의 인스턴스에 저장되며 테마 목록, 블로그, 마케팅 페이지가 포함됩니다..

4. 방문 페이지 및 모바일 개선

재 설계의 일환으로 Google은 다음과 같은 모든 주요 제품에 대한 새로운 방문 페이지를 구축했습니다. 만년설, 헤스티아, ShopIsle, , Feedzy, 비주얼 라이저, 과 WP 제품 검토.

그중에서도 대부분의 노력을 기울인 Hestia의 방문 페이지가 최상의 결과를 얻는 것으로 보입니다. 현재 전환율이 ~ 10 % 향상되었습니다. 현재 약 한 달 분량의 데이터를 검토하고있어 낙관적입니다..

헤스티아 뉴

전체적으로 사이트 전체에서 매출이 감소한 것으로 보입니다. 그러나 10 개 이상의 제품 (모두 적은 수의 판매에 기여한)을 제거하는 등 너무 많은 변화가있어 디자인 자체에 영향을주는 것은 어렵습니다..

이것은 올해에 설정 한 또 다른 목표와 관련이 있습니다. 사전 변경 수익의 90 % 만 유지하면서 동시에 50 % 더 단순한 비즈니스를 관리하더라도 가치가 있습니다. 비즈니스가 단순하다는 것은 제품 수를 줄여서 관리해야 할 페이지 수, 문서화 및 지원해야 할 작업 수를 줄여 기존 제품을 개선하는 데 더 많은 시간을 할애한다는 의미입니다..

모바일을위한 새로운 사이트 최적화는 전반적으로 훌륭했지만 100 % 문제가되지는 않았습니다. 구텐베르크를 새로운 페이지를 만드는 기초로 선택하는 것은 쉽지 않았으며 결국 모바일 성능을 크게 향상시키지 못했습니다..

Google은 제품 방문 페이지에 대해 50KB 미만으로 구현할 수 없었으므로 AMP에서이를 제공 할 수 없었습니다 (CSS가 AMP에 얼마나 큰지에 대한 제한이 있습니다). 하지만 카테고리 페이지에 AMP가 있습니다..

전체적으로 디자인이 Gutenberg, Elementor 및 기타 빌더와 작동 할 수 있도록하는 것은 어려운 일이었습니다. 또한 이러한 빌더가 구조를 출력 할 수 있도록하는 것뿐만 아니라 화면의 결과가 기대 한 것이어야합니다. 결국, 우리는 나중에 페이지를 수정할 수 있기를 원하며 코드 레벨에서 내용을 다시 실행할 필요가 없습니다. 이것이 디자인이 빌더와 작동해야하는 이유입니다.

John Fraskos의 수석 디자이너가이 과제에 대해 말한 내용은 다음과 같습니다.

프라 스코

가장 큰 과제는 일관되고 확장 가능한 디자인을 만드는 것이 었습니다. "빌더 불가지론" 프로젝트의 일부는 다른 레이아웃 빌더 기술을 사용하여 실행되기 때문입니다. 우리는 모든 구성 요소에 대한 기본 시각 언어를 좁히고 유지 관리했습니다. 이는 모든 레이아웃 빌더를 사용하여 쉽게 복제 할 수있어 미래에 대비할 수 있습니다.

이제 모바일에서 페이지를 탐색하기가 훨씬 쉬워졌지만 이는 우연이 아닙니다. 모바일 환경을 디자인하고 모바일 방문자와 데스크톱 방문자에게 무엇이 중요한지 생각하는 데 많은 노력을 기울였습니다. 계속해서 모바일 및 데스크톱의 일부 제품 페이지를 확인하고 다른 제품 (이 하나, 예를 들어).

복사 및 텍스트, 랜딩 페이지 및 기타 캠페인에 대한 마케팅 작업과 함께 전체 구현에는 상당한 시간이 걸렸습니다. 정확히 1,500 시간. 우리는 진지한 시간 추적을 수행하고 프로젝트에 소비 된 모든 순간을 재고하는 목표 중 하나를 만들었습니다..

계산할 시간당 요금을 곱하면 $ 50,000- $ 100,000 범위에있을 것입니다. 다시 말해, 타사를 위해 유사한 사이트를 구축하려면 수익성을 높이려면 1 억 달러 이상을 청구해야합니다..

우리에게 가장 큰 도전은 이것이 일회성, 독특한 프로젝트라는 사실이었습니다. 의미하는 바는 일반적으로 전자 상거래 사이트를 구축하지 않기 때문에 프로세스가 확립되어 있지 않으며 팀과 팀의 기술이 웹 사이트 구축 프로젝트를 위해 구성되지 않았습니다..

우리는 일을 조직하는 데 어려움을 겪고 있었으며 모든 일을 이끌거나 구성하는 방법을 몰랐습니다. 또한 모든 전면 프로젝트 및 사이트를 처리 할 전담 팀이 없었습니다. 사용자를위한 테마 및 플러그인 작성은 완전히 다른 종류입니다. 궁극적으로 올바른 길을 안내해 준 John Fraskos 덕분에 UI 디자인을위한 스케치, 디자인 협업 및 피드백을위한 Invision, 일상적인 토론을위한 Slack을 사용했습니다. 그리고 우리는 많은 반복을 겪었으므로 이러한 각 도구가 반드시 필요했습니다..

디자인 반복

따라서 주요 질문은 아마도 될 것입니다. 나는 프로젝트가 성공이라고 생각합니까??

때에 따라 다르지.

재 설계로 인한 단기 판매 증가는 보이지 않습니다. 우리는 여전히 편집 경험과 사이트 조정에 문제가 있습니다. 이 프로젝트는 더 순조롭게 진행될 수있었습니다. 그러나 하루가 끝났 는데도 여전히 장기적인 결과를위한 더 나은 투자를 볼 수 없습니다.

내년에는 프로젝트의 성공 여부를 알려줄 것입니다. 상황이 어떻게 진행되는지 궁금합니다.

또한 Neve Pro 출시 WCEU의 후원으로 우리에게는 새로운 시대가 시작됩니다. 좀 더 확고한 비즈니스가 되려고하는 시대와 일부 테마가있는 상점.

나도 여기서 공연을하는 유일한 사람은 아니었다. 좋은 팀 노력과 비즈니스 방향의 주요 변화였습니다. 더 적은 수의 고품질 제품에 집중함으로써 고객에게 더 가까이 다가 가고 고객의 요구에 더욱 공감합니다..

이 재 설계에 참여한 모든 사람에게 다시 감사합니다!

잊지 말고 확인하십시오 새로운 테마 아일!

WordPress 사이트 속도를 높이기위한 충돌 과정에 참여하는 것을 잊지 마십시오. 몇 가지 간단한 수정으로로드 시간을 50-80 % 줄일 수 있습니다.

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map