[구독형] Framer로 만드는 웹사이트, 프레이머(Framer) 서비스 소개 2
2024.05.22 11:04
7
0
https://eond.com/462765

한줄요약 : 프로토타입 제작용 웹/앱 디자인 플랫폼

(결제기능 없어요)

프레이머를 도입한 토스 같은 경우도, 디자인과 실제 결과물의 간극을 줄이기 위해, 디자이너들이 노코드 툴인 프레이머를 이용해서 인터렉션 등을 직접 만들어서 보여주고, 개발자가 그걸 기반으로 앱을 만들면 되서


가격 : 무료/미니/베이직/프로(2.6만)/엔터프라이즈

베이직까지는 검색 기능 제한이 있음.

프로버전이 기본적인 사이트 제작이 가능한 수준.

엔터프라이즈는 프레이머를 이용해서 여러개의 사이트를 만들려는 경우에 사용하면 됨.


Framer 서비스 소개: 웹 및 모바일 앱 디자인, 프로토타입 제작, 팀 협업을 위한 강력한 플랫폼

Framer는 웹 및 모바일 앱을 디자인하고, 프로토타입을 제작하고, 팀과 협업할 수 있는 강력한 플랫폼입니다. 코드 없이도 직관적인 인터페이스를 통해 디자인을 구현하고, 실제 장치에서 실행 가능한 프로토타입을 만들 수 있습니다. 또한, Framer는 팀 협업을 위한 다양한 기능을 제공하여 여러 팀원이 동시에 프로젝트를 진행하고 버전 관리를 할 수 있도록 지원합니다.

Framer의 주요 특징:

1. 코드 없이 디자인:

  • 코드 작성 없이 직관적인 인터페이스를 통해 웹 및 모바일 앱 디자인을 구현할 수 있습니다.
  • 다양한 디자인 요소를 드래그 앤 드롭 방식으로 추가하고 조정할 수 있습니다.
  • 실제 데이터를 사용하여 디자인을 미리보고 상호 작용을 테스트할 수 있습니다.

2. 빠른 프로토타입 제작:

  • 클릭 몇 번으로 실제 장치에서 실행 가능한 프로토타입을 만들 수 있습니다.
  • 애니메이션, 상호 작용, 트랜지션 등을 손쉽게 추가하고 조정할 수 있습니다.
  • 프로토타입을 공유하여 다른 사람들과 피드백을 주고받을 수 있습니다.

3. 효과적인 팀 협업:

  • 여러 팀원이 동시에 프로젝트를 진행하고 버전 관리를 할 수 있도록 지원합니다.
  • 디자인 시스템을 사용하여 팀 전체의 디자인 일관성을 유지할 수 있습니다.
  • 실시간 협업 기능을 통해 팀원들과 의견을 교환하고 작업을 진행할 수 있습니다.

4. 다양한 기능 확장:

  • Framer 확장 기능을 사용하여 기능을 추가하고 사용자 경험을 개선할 수 있습니다.
  • 다양한 프로그래밍 언어와 통합하여 더욱 강력한 기능을 구현할 수 있습니다.
  • API를 사용하여 다른 도구와 시스템과 연결할 수 있습니다.

Framer는 개인 디자이너부터 대규모 기업까지 다양한 규모의 조직에서 사용되고 있습니다. Framer를 사용하면 다음과 같은 이점을 얻을 수 있습니다.

  • 디자인 및 프로토타입 제작 시간 단축: 코드 작성 없이 빠르고 쉽게 디자인 및 프로토타입을 제작할 수 있습니다.
  • 팀 협업 개선: 여러 팀원이 동시에 프로젝트를 진행하고 버전 관리를 할 수 있도록 지원합니다.
  • 사용자 경험 개선: 실제 데이터를 사용하여 디자인을 미리보고 상호 작용을 테스트하여 사용자 경험을 개선할 수 있습니다.
  • 비용 절감: 개발 비용을 절감하고 시장 출시 시간을 단축할 수 있습니다.

Framer는 웹 및 모바일 앱 디자인, 프로토타입 제작, 팀 협업을 위한 훌륭한 도구입니다. Framer를 사용하면 더 나은 사용자 경험을 가진 제품을 더 빠르고 효율적으로 출시할 수 있습니다.

Framer에 대해 더 알아보고 싶으시다면 다음 링크를 방문하십시오:

라이믹스는 이온디와 함께

  • 2024.06.20 10:31
    베스트

    @이프노즈님, @개발을꿈꾸는디획자님 코멘트

    토스처럼 쓰려면 프레이머를 다 마개조해야되요. 토스는 프레이머 본사랑 계속 얘기해서 여러가지 기능 및 자체 플러그인을 개발해서 쓰는거지… 웬만한 회사는 그렇게 쓸라면 엄두조차 못낼듯합니다 프레이머 쪽 개발에만 리소스가 꽤 들어갈듯용…

    그리고 프레이머는 지금 웹플로우와 같이 간편하게 웹페이지를 만드는 서비스로 피벗을 한 상황이라서 목적이 꽤 달라졌어요.

    저는 프레이머를 간단한 랜딩페이지를 만들때 주로 사용합니다.

    반응형 웹 만들기가 쉽고 그 안에서 바로 퍼블리시가 되어요. 도메인도 붙여주고요.(유료) 

    재가 생각하는 장점은 

    잘 사용한다면 실제와 가까운 리얼힌 프로토타입


    단점은

    높은 러닝커브

    빠른 프로토타입을 만들기 어렵고 개발자 도움이 필요하다는 것


    Q. 자동으로 모바일 버전도 만들어주나요?

    아뇨 웹을 걍 만들어보시면 이해가 빠르실텐데 하나의 페이지를 만들면 breakpoint별로 대지가 생성되고 그게 다 연결되어있어요.


    Q. 프레이머로 디자인을 제작하면 간단한 구조 같은건 따로 퍼블리싱 없이도 바로 도메인을 붙여서 오픈할 수 있다는 얘기신가요??

    A. 네, 프레이머는 유튜브 채널에서도 튜토리얼이 많은 편이라 살펴보시면 좋을듯하네요. 복잡한 서비스는 비추지만, 간단한 랜딩페이지, 개인 포폴이나 블로그 수준으론 훌륭합니다.

     


  • 2024.06.20 10:36
    베스트

    프레이머로 개발 비용 낮추기(부제:프레이머 도입기) | Medium

    그러나 문제는 대부분의 핸드오프 과정에서 발생했습니다. 움직이지 않는 정적인 화면을 전달하는 과정에서 소요되는 시간과 비용이 상당했습니다. 다음 화면은 어디로 이동하는지, 컴포넌트들은 어떻게 움직이는지, 어떤 모달이 나타나는지 등 실제 화면에서 어떻게 구현되는지 소통하는 과정은 비효율의 극치였습니다. 그러다 보니 디자인된 화면과 실제 개발된 화면의 간극은 오롯이 사용자가 감당해야 하는 부분이였습니다.

    이 부분이 제일 핵심인거 같습니다. 일반 고객이 일반 디자이너에게 요청할 경우에는 이런 부분이 따로 고려되지는 않을 거 같구요..

    특정 플랫폼을 만든다거나 좀 딮하게 개발이 들어가는 플젝일 경우라면 프레이머 도입을 생각해볼만 하겠지만..

    일반 사용자라면 굳이 프레이머라는 생각이네요.

    국내에서 사이트 제작을 의뢰하시는 분들이라면 아임웹으로도 충분하지 않을까요?

닫기

마이페이지

로그인을 해주세요

네이버로 로그인