• 공통적인 직급이 있는 회사의 특징
• 공통적인 직급이 없는 회사의 특징
  • 위의 유형별 작업 방식
    • 1번 유형
      • 후기
    • 2번 유형
      • 후기
    • 3번 유형
• 업무를 자율적으로, 내가 회사의 주인이라는 마음을 가지게 하려면?

1. 직급이 있는 회사 ( 사원 - 팀장 - 이사 - 대표(거의 경력순)) 7명대 (pm없음, 기획자 없음) - 서비스제공 회사
2. 직급이 있는 회사 ( 사원 - 팀장 - 파트장 - 대표) 300명대 (pm없음, 기획자 없음) - 에이전시
3. 영어이름을 쓰는 회사 20명대 (경력에 상관없으나 형식적인 팀장 직급은 있음, pm 역할 하는 사람이 있음, 기획자 있음) - 서비스제공 회사
4. 영어이름을 쓰는 회사 60명대 (pm 있음, 기획자 있음)

공통적인 직급이 있는 회사의 특징

• 업무프로세스
  1. 업무 시작단계
• 자신이 얻을수있는 정보가 한정되어있다. 업무 대부분의 우선순위는 위에서 지정되고 있고, 일은 하달제여서 일을 받았을때 일을 하기 위한 배경지식 정도만 얻을수있고, 큰 그림을 받지 못해 추후에 변경이 될 경우,
  1. 업무 중간 2-1. 기획 내용, 또는 디자인이 변경됬을 시
  2. 작업자의 의사표현

공통적인 직급이 없는 회사의 특징

• 업무프로세스
  1. 업무 시작단계
• 업무의 우선순위 자체는 pm급이나 총관리자가 지정. 그러나 그것에 대한 공유는 실제 일하는 실무자에게 전부다 공유되고 있고, 일을 시작할 시 기획 리뷰 최소 1번, 디자인 리뷰 최소 1번, pm을 통한 일정 분배
  1. 업무 중간 2-1. 기획 내용, 또는 디자인이 변경됬을 시 : 서비스 단톡방에서 기민하게 변경사항 공유,
  2. 작업자의 의사표현

위의 유형별 작업 방식

1번 유형

• 디자이너가 기획을 겸해서 별도로 존재하지 않고, 구두로 전달. 지라로 티켓관리를 하는 스크럼 방식이지만 티켓이 별도 생성되는 경우는 잘없고. 그마저도 글뿐이라 상세 내용은 적음.
• 피그마 에서 어떠한 코멘트도 먼저 달리는 경우 없음. 수정이 되도 그 부분에 대한 코멘트 없음. 작업자가 수정된 시간을 보고 파악.
• 일을 전달받을때 일에 대한 배경지식 범위 적음.
• 회사 전체 align이 공개되지않고 수시로 작업우선위가 바뀜.
• 업무 전달시 업무 공유가 전체적으로 되지않고 1:1단위로 전달전달 하는 방식이라 일처리속도가 매우 느림.
• 그 와중에 자기가 한 일에 대한 보고는 수시로 받음.

후기

• 정말 최악의 회사

2번 유형

• 에이전시다 보니 제이쿼리와 psd사용. 대부분의 기능은 특정한 어도비의 툴을 사용하여 개발.
• 기획적인 내용은 위에서 다 결저되고, 실제 작업자는 디자인만 받게 됨. 디자인에 대한 별도의 리뷰는 없음.
• 이 회사도 밑에서 작업시 팀장을 통해서 배포 및 업무 관리

후기

• 에이전시 특성상 공통 모듈 및 컴포넌트는 없고, 개인의 성장은 약해질수밖에 없는 환경

3번 유형

• 회사 전체의 align 공개
• 기획 리뷰, 디자인 리뷰 각각 최소 1번씩은 필수로 진행
• 디자인리뷰시에 각자의 작업자에게 얼마나 기간이 걸릴지 예상 기간을 물어봄. (단, 이때 대답은 중간에 추가로 일이 들어올것을 대비해서 답변) 기간이 너무 길게 되면 디자인, 기획쪽과 조율.

업무를 자율적으로, 내가 회사의 주인이라는 마음을 가지게 하려면?

1. 회사의 전체 align 이 투명하게 공개가 되어야 한다.

2. bottom-up 에서 나오는 의견 수렴이 잘되거나 모두가 평등하여 의사표현이 잘되어야 한다. (직급제에서는 bottom-up에서 의사표현이 잘되지는 않는 상황. 일의 주체 및 배경지식은 위에서 진행되기 때문에 밑에 사람은 일부분의 일의 내용만 알게되고, 그 일부분안에서 고민을 하게되지만, 고민의 범위가 작아 창의적인 생각과 아이디어가 나올범위가 좁음. ) 모두가 평등하고 1에서 회사의 전체 align 이 나온다면 그 안에서 각자의 업무에 맞춰 고민을 하게 되고, 그 고민안에서 창의력이 나오게 된다.

3. 제한, 규정이 최대한 적어야 한다.
   • 하루에 공유가 아닌 보고를 2번씩 한다던가(규정), 1번 2번처럼 제한적인 정보만 가지고 내려오는식의 업무만 한다던가(제한). 이렇게 정보가 없을수록 직원들의 창의력은 다운.
4. 최종결정권자는 있어야 한다. 모두가 평등하게 될때 최종결정권자가 힘이 약하거나 존재하지 않다면,

가독 및 디자인을 위해서 노션앱으로 진행중입니다. feconf2020에서 만나요~ 바로가기

• img wrapping 방법에 대하여

img wrapping 방법에 대하여

프로필 이미지처럼 이미지를 감쌀때 이미지가 큰 경우 기존엔

@mixin absolute-full($type:true, $num:0, $direction:none) {
  @if($type==img) {
    position: absolute;
    top: -100%;
    left: -100%;
    right: -100%;
    bottom: -100%;
    margin: auto;
    @content;
  }
}

이런 방식을 써서 이미지를 가운데에 놓고 세로나 높이가 긴쪽을 기준으로 했었는데 이 방식을 하니 비율이 맞지 않는 이미지에서는 여백이 생기게 됬었다.

그래서 개선한것이

 object-fit : cover;

인데 이건 ie11과 안드 4.4미만 버전에서는 적용이 안되고,

이 다음으로 개선된 것은

 //html
 <div className="img-cover">
            <div className="image-wrapper" style=> </div>
          </div>
          
   //scss
   .img-cover {
    position: relative;
    width: 150px;
    height: 150px;
    .image-wrapper {
      position: absolute;
      top: 0;
      left: 0;
      bottom: 0;
      right: 0;
      background-size: cover;
      background-repeat: no-repeat;
      background-position: 50% 50%;
    }
  }

• png 와 svg 비교
  • 특징
    • svg
    • png

png 와 svg 비교

특징

svg

• (장점) react 같은 data framework 에서는 상태로 이미지 변경, 애니메이션등 기능 추가 편이
• (단점) ie에서 이미지태그에 src 로 썼을 시에는 안나오는 경우도 발생.
• (단점) 코드안에 텍스트가 들어갈 경우 폰트 패밀리에 따라 폰트가 적용 안될 수 있으니 다시 지정해야됨.
• (단점) 자체 사이즈가 정확하지 않아서 figma 나 제플린으로 받을 시 뒤에 소수점으로 단위가 나올 수 있음.

png