홈페이지 » 툴킷 » 포토샵보다 나은 프로토 타입 5 앱 디자인

    포토샵보다 나은 프로토 타입 5 앱 디자인

    Photoshop은 디자이너와 CSS3P 및 FontAwesomePS와 같은 확장 기능으로 널리 사용되는 도구이므로 웹 디자인 프로토 타입을 만드는 데에도 좋은 도구입니다. 그럼에도 불구하고, 이 목적을 위해 실제로 만들어지지 않았습니다. 현재의 트렌드가 반응 형 디자인, CSS 프리 프로세서, CSS 프레임 워크 및 해상도 독립적 그래픽 (SVG)으로 발전함에 따라 Photoshop은 웹 디자인과 관련성이 낮아지고 있습니다.

    차이를 채울 수 있도록 독립 개발자가 만든 많은 대체 앱이 있기 때문에 걱정하지 않아도됩니다. 이 게시물에서 우리는이 앱을 살펴보고 알아낼 것입니다. 웹 디자인 프로토 타입 제작을 위해 Photoshop과 비교했을 때 얼마나 뛰어난 지 여부.

    1. 웹 플로우

    웹 흐름을 사용하면 끌어서 놓기로 웹 사이트를 디자인 할 수 있습니다. 웹 플로우는 부트 스트랩 그리드를 기반으로 레이아웃을 생성하므로 웹 사이트 디자인이 반응 형입니다. 웹 플로우에는 웹 플로우 작업 공간에 추가 할 수있는 블록, 목록 및 텍스트 형식과 같은 일련의 표준 웹 구성 요소가 함께 제공됩니다.

    사이드 패널에서 스타일을 쉽게 추가 할 수 있으며 요소의 속성도 추가로 조정할 수 있습니다. 디자인이 완료되면 디자인 결과를 코드 HTML 및 CSS로 내보낼 수 있습니다. 팀과 작업을 공유 할 수도 있습니다..

    2. 아보 코드

    Avocode는 PSD 파일을 지원하며 HTML 및 CSS가 포함 된 실행 가능한 웹 사이트로 즉시 편집하고 변환 할 수 있습니다. Avocode는 CSS, 이미지 및 SVG (있는 경우)를 포함하여 프로젝트의 모든 자산을 추출합니다. CSSHat과 통합되었으므로 선택한 레이어에 대해 Less, SASS 또는 Stylus 형식으로 CSS를 쉽게 추출 할 수 있습니다..

    또한, Avocode는 잘못된 수정 사항이있을 때를 대비하여 이전 설계로 되돌릴 수있는 개정 제어 기능을 갖추고 있습니다..

    3. 잉꼬

    Macaw에서는 Adobe Photoshop과 같은 이미지 편집기에서 작업하는 경우 웹 레이아웃과 웹 요소를 디자인 할 수 있습니다. 열 또는 블록 영역을 만들고, 위치를 조정하고, 필요에 따라 타이포그래피를 설정할 수 있습니다. Macaw에서는 여러 요소의 스타일을 한 곳에서 변경할 수 있습니다. 또한 라이브러리를 사용하여 나중에 사용할 수 있도록 모든 요소를 ​​저장할 수 있습니다..

    반응 형 디자인을 만들기 위해 Macaw에서는 모든 장치에 대해 중단 점을 설정하고 사이트를 최적화 할 수 있습니다. 디자인 프로세스가 완료되면 Macaw는 적절한 HTML과 CSS를 생성 할 수 있습니다..

    4. 스케치

    스케치는 인터페이스와 웹 사이트를 디자인하는 데 이상적입니다. 비트 맵 대신 벡터 기반 객체를 만듭니다. 따라서 캔버스 크기를 조정할 때 디자인 품질이 떨어지지 않습니다. '기본 제공 격자'와 같은 기능을 사용하면 개체 또는 웹 레이아웃 배치를보다 효과적으로 정렬 할 수 있습니다..

    또한 Sketch는 Webkit에 표시된 것과 비슷한 글꼴을 렌더링합니다 (Chrome, Opera, Safari를 생각해보십시오). 따라서 이미지의 텍스트 결과가 브라우저에 표시된 원본 텍스트만큼 정확하고 빠르지 않을까 걱정할 필요가 없습니다. 스케치는 레이어의 각 요소에 대해 CSS를 내보낼 수도 있습니다..

    5. 앤티 타입

    AntType은 시각적 디자인에 중점을 둔 벡터 기반 응용 프로그램으로 그라디언트, 그림자, 내부 그림자, 텍스트 그림자, 경계선 스타일 및 둥근 모서리와 같은 인터페이스 요소를 만드는 데 적합합니다. Antetype은 프로젝트에서 직접 사용할 수있는 수백 가지 위젯을 제공합니다..

    반응 형 디자인을 만들려면 화면 크기를 조정할 중단 점을 설정할 수 있습니다. 이미지 또는 CSS의 형태로 각 요소를 내보낼 수도 있습니다.