"ChatGPT와 몇 년 대화하며 알게 된 AI의 한 가지 특성"

작성자:
 ChatGPT를 사용한 지도 꽤 오래되었다. 처음에는 단순히 코드를 물어보는 용도로 시작했지만, 지금은 개발, 사업, 계약, 투자 등 정말 다양한 주제로 대화를 나누고 있다. 그러다 문득 한 가지 특성을 발견했다. ChatGPT는 사람이나 회사를 쉽게 비난하지 않는다. 예를 들어 내가 실제 경험을 이야기하면 AI는 내 말을 무시하지 않는다. "그럴 가능성도 있습니다." "그렇게 느끼셨을 수 있습니다." "그런 해석도 가능합니다." 이런 식으로 대답한다. 하지만 그 다음 단계로 넘어가지는 않는다. 예를 들어, "그 회사는 원래 악덕 회사입니다." 또는 "상대방이 일부러 그렇게 한 것입니다." 처럼 의도나 악의를 단정해서 말하지 않는다. 처음에는 답답하다고 생각했다. '내가 실제로 겪은 일인데 왜 이렇게 조심스럽게 말하지?' 하지만 오랫동안 사용하면서 이유를 조금은 이해하게 되었다. AI는 누군가의 경험을 존중하면서도, 그 경험만으로 상대방의 의도까지 사실처럼 단정하지 않으려는 성향이 있었다. 생각해 보면 이것은 꽤 합리적인 방식이다. 같은 사건이라도 서로의 입장은 다를 수 있고, AI는 한쪽 이야기만 듣고 상대를 비난하는 도구가 되어서는 안 되기 때문이다. 그렇다고 사용자의 말을 무조건 부정하는 것도 아니다. 확인 가능한 사실은 사실대로 인정하고, 확인할 수 없는 의도는 가능성으로만 표현한다. 오랫동안 사용해 보니 이것이 ChatGPT의 일관된 답변 방식이라는 인상을 받았다. AI를 사용하다 보면 가끔은 너무 신중하다고 느껴질 수도 있다. 하지만 한편으로는 이런 특성 덕분에 AI가 근거 없는 비난이나 명예훼손에 쉽게 이용되지 않는다는 장점도 있다고 생각한다. 결국 AI는 사람처럼 편을 드는 존재라기보다, 사실과 추측을 최대한 구분하려는 도구 에 더 가까운 것 같다.
댓글 쓰기

Swiper-slider로 반응형 작업할 때 이미지 사이즈에 따라서 높이 지정하기

작성자:

 Swiper 슬라이더를 사용하면 웹페이지에 쉽게 슬라이드 기능을 삽입할 수 있습니다.

심지어는 반응 형 웹을 개발할 때도 옵션 만으로 쉽게 반응 형 기능을 구현할 수 있습니다.

autoHeight : true;

위와 같이 옵션을 주면 이미지의 넓이에 맞춰서 이미지의 높이가 자동 조절됩니다. 

하지만 이미지의 크기가 그리 크지 않을 때에는 화면을 줄임에 따라 이미지의 높이가 자동 

조절 되면서 이미지가 너무 작아져 버리는 문제가 생깁니다. 

그래서 이미지가 줄어들 때 이미지의 넓이에 맞춰서 높이를 강제 지정해 주어야 하는 것이

필요할 때도 생깁니다.   

<body>
    <section class="main swiper mySwiper">
      <div class="wrapper swiper-wrapper">
        <div class="slide swiper-slide">
          <img src="images/img01.jpg" alt="" class="image" />
        </div>
        <div class="slide swiper-slide">
          <img src="images/img02.jpg" alt="" class="image" />
        </div>
        <div class="slide swiper-slide">
          <img src="images/img03.jpg" alt="" class="image" />
        </div>
      </div>
      <div class="swiper-button-next nav-btn"></div>
      <div class="swiper-button-prev nav-btn"></div>
      <div class="swiper-pagination"></div>
    </section>

    <!-- Swiper JS -->
    <script src="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.js"></script>

    <!-- Initialize Swiper -->
    <script>
      var swiper = new Swiper(".mySwiper", {
        slidesPerView: 1,
		autoplay: {     //자동슬라이드 (false-비활성화)         
		    delay: 2500, // 시간 설정          
		   disableOnInteraction: false, // false-스와이프 후 자동 재생        
		},
        loop: true,
        pagination: {
          el: ".swiper-pagination",
          clickable: true,
        },
        navigation: {
          nextEl: ".swiper-button-next",
          prevEl: ".swiper-button-prev",
        },
      });
    </script>
  </body>

위의 코드는 Swiper 슬라이더에서 제공해 주는 기본 코드 중에 하나 입니다.

브라우저의 화면 크기에 따라 높이도 자동으로 조절되는 듯이 보이지만 마우스를 이용

해서 브라우저의 넓이를 서서히 줄이면 높이가 변하지 않고 그대로 유지 됩니다.

마우스를 이용해서 브라우저의 크기를 변경할 때는 아래와 CSS 코드를 만들어 주시면

됩니다.

  <style>
	@media screen and (max-width: 1024px) {
            .swiper{
		height: 650px !important;
            }
    }

	@media screen and (max-width: 768px) {
            .swiper{
		height: 450px !important;
            }
    }
  </style>

Swiper 슬라이더를 아래와 같이 CDN으로 사용하므로 ! important 선언을 해서 height 속성의 우선 순위를 높여 줍니다. 


    <link
      rel="stylesheet"
      href="https://cdn.jsdelivr.net/npm/swiper@11/swiper-bundle.min.css"
    />

댓글

댓글 쓰기