설계 기술이 없는 새 항목 만들기

6936 단어 designwebdev
여보게, 동료들아!
이번에는 신제품을 처음부터 구축하고 실제 기능에 집중하기 전에 예쁘고 매력적인 장애를 극복할 수 있는 방법을 찾겠습니다.
개인 프로젝트를 만들든지, 빠른 POC를 만들든지, 심지어는 사이드 MVP를 만들든지, 이런 도구를 사용하면 좋은 출발점으로 시작하고 실행하는 데 도움을 줄 수 있고, 충분히 떳떳하게 다른 사람과 공유하고, 그것을 현실로 바꾸기 전에 반송을 수집할 수 있다.
그럼에도 불구하고 우리가 무엇을 사용하여 우리의 프로젝트를 인도할 수 있는지, 그리고 시작 단계에 더욱 가까워질 수 있는지 봅시다.

입문


그래서 우리는 홈런일 수도 있다는 생각을 가지고 있다. 홈런이 괜찮아 보이기를 바라기 때문에'다른 일'로 간주되지 않는다.
가장 기본적인 필수품은 무엇입니까?
우리는 주로 세 가지 물건이 필요하다.
  • 팔레트
  • 예쁜 로고
  • 글꼴 한 쌍.
  • 원한다면 구호와 브랜드와 관련된 키워드를 추가할 수 있다.
    현재 팔레트는 프로젝트와 사용할 모든 관련 자산에 시각적 일치성을 제공하기 위한 것이다.
    로고는 프로젝트의 외관이다. 사람들이 처음으로 야외에서 그것을 만났을 때 무엇을 볼 수 있는지, 단지 하나의 도형이든 명칭을 포함하는 일부분이든 관중들의 머릿속에 남을 것이다.
    마지막으로 이 글꼴은 프로젝트에 시각적 일치성을 다시 제공했지만 이 예에서 모든 쓰기 부분은 이렇다.
    한 항목은 보통 주 글꼴과 보조 글꼴이 필요하지만, 어떤 특수한 상황에서는 세 번째 글꼴이 필요하다고 한다. 비록 이것은 흔하지 않지만.
    이제 우리는 요점을 정했다. 우리 처음부터 순서대로 모든 문제를 해결하자.

    팔레트


    전체 프로젝트에 사용되는 팔레트를 위해 서로 일치하고 보완되는 색을 선택합니다(무작위로 조합하거나 전체 프로젝트에서 한 번만 사용하는 색을 선택하지 않음). 그 자체가 예술 형식입니다.
    그러나 적당한 상호보완색을 선택하는 것은 예술일 뿐만 아니라 과학이기도 하다.그 밖에 그 모든 목적은 하나의 프로젝트의 기초로서 그것을 보기 좋게 하고 사용자와 일치하게 하는 것이다.
    이것은 상당히 주관적인 문제일 수도 있지만, 너는 보기에 괜찮은 것이 얼마나 많은 공통점이 있는지 놀라게 될 것이다.
    이 작업에 대해 우리는 colormind.io 라는 온라인 도구의 도움말을 사용할 것입니다. 이 도구는 프로젝트의 기본 색으로 사용할 수 있는 일치하는 배색 방안을 만들 수 있습니다.

    "생성"단추를 누르면 5가지 색을 만들 수 있습니다. 이것은 협동하여 작업할 수 있습니다."잠금"을 통해 이전에 선택한 색을 사용할 수 있습니다. 생성기는 추가 색을 찾을 수 있습니다.
    색상 선택기를 사용하여 일부 컨텐트가 없거나 마음에 들지 않는 색조의 선택 색상을 변경할 수 있습니다.너는 색깔 사이에서 위치를 바꾸어 그것들이 함께 있는 모습을 볼 수 있다.
    귀신이 곡할 노릇이다. 이미지를 업로드할 수도 있다. 생성기는 이미지에서 색을 선택하고 나머지 색을 권장하여 브랜드를 위해 응집력 있는 팔레트를 만들 수 있다.

    브랜드 로고


    그림에 대해 말하자면, 프로젝트의 주요한'얼굴'로서 좋은 그림이 없다면, 좋은 색깔은 무엇입니까?
    Canva 같은 사이트나 Gimp, Inkscape 같은 도구를 사용할 수 있고, 심지어는 ol'trusty Paint를 사용하여 새로 만든 팔레트와 모양으로 로고를 만들 수 있다.
    하지만 공교롭게도 디자인 기술이 부족하거나'괜찮아 보인다'는 것을 모르면 어때요?
    다시 한 번, 우리는 이 일을 완성하기 위해 도구를 사용합시다.이 예에서 우리는 BrandMark라는 이름을 사용할 것이다.
    일단 사이트에 로그인하고 "내 로고 만들기"단추를 누르면 당신이 만들고 싶은 브랜드에 대한 질문이 있습니다. 예를 들어 명칭, 선택할 수 있는 구호와 관련 키워드 등입니다.
    일단 당신이 모든 정보를 제공하면, 이 사이트는 당신에게 선택할 수 있는 거의 무궁무진한 옵션을 만들기 바쁘고, 당신에게 몇 가지 옵션을 줄 것입니다.
  • 현재 로고(이름, 표어, 아이콘, 색상 등) 편집 옵션
  • '창의'라는 옵션을 선택하면 로고를 더욱 맞춤형으로 보일 수 있습니다.
  • 만약 당신이 (내가 처음 시도했을 때처럼) 당신을 위해 만든 로고에 놀랐다면 로고를 저장하는 것을 선택할 수 있습니다.
  • 만약에 완전한 측면 시장을 창조하고 디지털과 물리 제품을 제작하며 어느 곳에서든 홍보하고 싶다면 당신이 필요로 하는 모든 자산을 포함하는 완전한 브랜드 패키지를 구매할 수 있다.this example에 포함된 모든 내용을 진지하게 보라는 뜻입니다
  • 그럼에도 불구하고 이 모든 것이 있어서 우리는 퍼즐의 마지막 조각을 놓쳤다.

    이 글꼴


    현재 기본 시스템 글꼴을 사용하고 싶지 않거나 전형적인 "Lato"와 "Roboto"글꼴에서 전환하고 싶습니다.너는 스스로 잘 어울리는 두 가지 글씨체를 검색할 수 있다. (나처럼 몇 시간 동안 다른 조합을 선택할 수도 있다.)🙄)
    그러나 다시 한 번, 우리가 모든 것을 쉽게 할 수 있는 도구가 있을 때, 우리는 그렇게 무거운 일을 할 필요가 없다.이런 상황에서 이 도구는 Fontjoy 라고 부른다.

    이것은 매우 간단하다.텍스트 예제와 일치하는 글꼴을 생성하려면 Generate 버튼을 클릭합니다.너도 글씨체가 있을 수 있다. 너는 이미 좋아하고 파트너를 찾고 싶다.
    특정 글꼴의 자물쇠를 누르면 생성기는 다른 일치하는 글꼴을 찾을 수 있습니다. (이미 논의한 바와 같이 최대 3가지 글꼴이 있을 수 있습니다.)사용할 글꼴의 스타일을 선택할 수도 있습니다.
    선택한 글꼴 간의 명암비를 늘리거나 줄이기 위해 조정할 수 있는 슬라이더도 있습니다 (즉, 생성된 글꼴이 서로 더 비슷하거나 다르다).
    이제 이 세 가지 요소가 생겨서 우리는 거의 우리의 생각/원형/MVP의 모든 브랜드를 완성했다.이제 이 모든 원소를 조합할 때 우리가 얻은 것이 무엇인지 봅시다.

    모든 것을 한데 모으다


    예를 들어 저는 여러분께 이 도구들을 동료와 합작한 프로젝트의 일부분으로 사용하고 싶습니다.
    이 프로젝트의 아이디어는 한 잡화점에 사이트를 만들어 사용자가 그곳에서 제품 목록에서 선택한 제품을 쇼핑카트에 추가할 수 있도록 하는 것이다.
    다음은 사이트 팔레트를 형성하는 생성 색상입니다.
    $blue: #6b879f;
    $orange: #ce794b;
    $white: #dfd9c6;
    $secondary: #8c8283;
    $tertiary: #ad7d67;
    

    이 도구가 만든 로고입니다.

    다음은 이 모든 내용들입니다. (홈페이지 메인 페이지에서)

    Shoppery 홈 페이지
    이제 볼 수 있듯이 홈페이지의 시각적 효과는 한 사이트에 있어서 이미 충분하다. 홈페이지는 보기에 그다지 아마추어적이지 않고 이 모든 내용을 한데 놓는 데 너무 많은 시간이 필요하지 않다. (총 2시간이 안 될 수도 있다.)
    남은 일은 코드를 작성해 사이트에 표준 쇼핑몰 기능을 제공하는 것이다.
    일단 이 브랜드들을 창설하면 그들은 이미 세워진 브랜드의 배경에 있을 것이다.
    이것은 거의 당신이 선택한 프레임워크에서 코드를 배우고 작성하여 프로젝트, 생각, 부차적인 임무 등 필요한 특성을 구축하는 관건이다.
    너는 지금 이 원소들을 보기 좋은 원형에서 보기 좋고 기능이 강한 항목으로 바꿀 수 있다.
    너도 간단한 방식을 선택하여 서비스를 이용하여 프로젝트에 필요한 코드를 생성할 수 있다. 예를 들어 Divjoy 또는 Appseed
    안녕하세요!우리는 단지 우리의 친구 기술을 이용하여 우리가 제품을 만드는 과정에서 시작하는 것을 도울 뿐이다. 너무 많은 번거로움을 필요로 하지 않고 특별한 기술을 필요로 하지 않는다. 가장 중요한 것은 세부 사항을 실현하는 데 너무 많은 시간을 들일 필요가 없다는 것이다.
    이번 주 댓글 여기까지!유용하고 정보가 풍부하며 다음에 당신(또는 당신이 아는 사람)이 아이디어를 가지고 원형을 빨리 얻어 실행 가능한지 테스트할 때 그 중의 일부 도구를 사용할 수 있기를 바랍니다.
    나는 이미 나의 프로젝트와 업무에서 여러 번 사용한 적이 있다. 그들은 나를 위해 많은 시간을 절약하고 세부 사항과 세부 사항 사이에서 선택할 수 있게 했다. 그러나 내가 먼저 구축해야 할 대국을 잊어버렸다.😅
    지금까지 읽어 주셔서 감사합니다. 시간을 절약하고 다음 글에서 연락 드리겠습니다.
    사진은 Halacious 에서 Unsplash

    좋은 웹페이지 즐겨찾기