포트폴리오 35
[시안] 서브 시안 인스타 업로드
안녕하세요. 플입니다. 오늘은 인스타그램에 서브 시안을 업로드해서 알려드리러 왔습니다. 1. 서브 페이지 업로드 인스타에 마지막 서브 페이지를 업로드했습니다. 썸네일을 모두 동일한 배경으로 맞춰서 올렸습니다. > 인스타그램 바로가기 인스타그램 링크도 남겨둘게요~ 2. 섬네일 섬네일은 모두 동일한 폼을 만들어서 같은 홈페이지의 디자인이라는 것을 알기 쉽게 했습니다. 3. 스토리 인스타그램에 스토리도 고정해놨습니다. https://ssimplay.tistory.com/53 [인스타] 스토리 고정하기 안녕하세요. 플입니다. 오늘은 인스타그램 스토리를 고정해보겠습니다. 인스타그램의 스토리 기능은 24시간이 지나면 사라집니다. 이것을 사라지지 않고 프로필에 고정시켜두는 것을 해보겠습니다. 1. 스토리 업.. ss..
[반응형] 포트폴리오 사이트
안녕하세요. 플입니다. 오늘은 포트폴리오 사이트 서브 시안을 소개해보겠습니다. 1. 첫 번째 서브 페이지 About 첫 번째 페이지는 두 단락으로 나눠 경력과 기술 능력을 한 페이지에 보여줬습니다. 배경색을 다르게 해 단락을 확실하게 구분했습니다. 2. 두 번째 서브 페이지 Portfolio 두 번째 페이지 시안은 메뉴를 수정하기 전에 저장해서 첫 번째 페이지가 강조되어있지만 넘어가겠습니다. 두 번째 서브 페이지는 작업물을 보여주는 페이지로 이 사이트에서 가장 중요한 페이지입니다. 메인과 동일한 섬네일을 사용하였고 메인에서 더보기를 누르면 넘어오는 페이지입니다. 서브 페이지에서 더보기를 누르면 더 많은 작업물을 볼 수 있습니다. 그리고 메인과 다르게 카테고리를 추가해 카테고리별로 살펴볼 수 있게 만들었습..
[html] 타이틀 코딩하기
안녕하세요. 플입니다. 오늘은 포트폴리오 서브페이지 타이틀을 코딩을 해보겠습니다. 1. 전체 디자인 확인하기 우선 시안을 보고 전체 디자인을 확인합니다. 제 시안을 살펴보면 세 가지 특징을 알 수 있습니다. 첫 번째, 전체적으로 가운데 정렬이다. 두 번째, 큰 제목과 소제목이 있다. 세 번째, 배경이 있다. 기본 틀이 되는 html은 논리적으로 코딩하는 것이 중요함으로 세가지 특징을 생각하면서 코딩하도록 합니다. 2. 코드 구상하기 구상한 코드를 이미지화해봤습니다. 첫 번째로 배경을 넣어주려면 감싸주는 태그가 필요하겠죠. 간단히 div로 감싸주기로 합니다. 감싸주는 태그는 여러 경우가 있지만 사이즈를 맞춰야 하니 block태그인 것으로 하는 것이 좋습니다. 두 번째로 큰 제목은 서브 페이지의 주제입니다...
[포토샵] 카테고리 버튼 만들기
안녕하세요. 플입니다. 오늘은 카테고리 버튼을 만들어보겠습니다. 1. 배경 도형 만들기 먼저 도형 툴을 이용해 배경을 만들어줍니다. 저는 배경으로 사용할 도형을 사각형으로 만들 것입니다. 각자 원하는 모양으로 만들어주세요. 아무 곳이나 클릭하면 이렇게 수치를 입력할 수 있습니다. 직접 드래그해서 사이즈를 정해도 상관없지만 수치를 입력하는 게 정확한 사이즈로 나와서 편합니다. 확인 버튼을 누르면 이렇게 수치에 맞는 사각형 도형이 나옵니다. 2. 위치 잡아주기 만들어둔 그리드를 열어서 그리드에 맞춰 위치를 수정해줍니다. 이미지를 보면서 다른 요소들과 간격을 잡아줍니다. https://blog.naver.com/ssimplay/221605456174 [Assistor PS] 그리드 만들기 안녕하세요. 플입니다..
[포토샵] 일러 도형 활용
안녕하세요. 플입니다. 오늘은 일러에서 만들었던 도형을 활용해보겠습니다. https://ssimplay.tistory.com/73 [일러] 키캡 만들기 2 안녕하세요. 플입니다. 만들어본 키캡이 마음에 안 들어서 조금 다르게 만들어봤습니다. 1. 정사각형 만들기 도형 툴을 선택하고 shift키를 누른 상태로 드래그 해 정사각형을 만들어줍니다. 2. 곡선 넣기 펜.. ssimplay.tistory.com 도형은 위의 포스팅에서 확인 가능합니다~ 포트폴리오 시안 이건 포트폴리오 시안 작업 중 일부를 캡처해본 것입니다. 저번 포스팅에서 만들어둔 키캡 도형을 이런 식으로 활용해봤습니다. 키캡을 메인 컬러로 바꿔준 뒤 해당 연도를 표시하는 배경으로 활용해봤습니다. 완성된 모습 완성된 모습입니다. 퍼블리셔라는 직업..