add emoji
This commit is contained in:
1 parent
38866fbfc7
commit
15e5ef98b7
1 file changed
+129
-44
+129
-44
@@ -7,16 +7,20 @@
|
||||
<link rel="icon" type="image/svg+xml" href="/img/favicon.svg">
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800&family=Caveat:wght@500;700&display=swap" rel="stylesheet">
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800&family=Caveat:wght@500;700&display=swap"
|
||||
rel="stylesheet">
|
||||
<link rel="stylesheet" href="/css/style.css">
|
||||
|
||||
<title>Примеры мультфильмов и рекламной анимации — О’ляпка</title>
|
||||
<meta name="description" content="Посмотрите примеры ИИ-анимации студии О’ляпка: рекламные ролики, детские сказки и персональные подарки. Выберите идею для своего мультфильма.">
|
||||
<meta name="description"
|
||||
content="Посмотрите примеры ИИ-анимации студии О’ляпка: рекламные ролики, детские сказки и персональные подарки. Выберите идею для своего мультфильма.">
|
||||
<link rel="canonical" href="https://olapka.ru/portfolio">
|
||||
<meta name="robots" content="index, follow, max-image-preview:large">
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:title" content="Примеры мультфильмов и рекламной анимации — О’ляпка">
|
||||
<meta property="og:description" content="Посмотрите примеры ИИ-анимации студии О’ляпка: рекламные ролики, детские сказки и персональные подарки. Выберите идею для своего мультфильма.">
|
||||
<meta property="og:description"
|
||||
content="Посмотрите примеры ИИ-анимации студии О’ляпка: рекламные ролики, детские сказки и персональные подарки. Выберите идею для своего мультфильма.">
|
||||
<meta property="og:url" content="https://olapka.ru/portfolio">
|
||||
<meta property="og:image" content="https://olapka.ru/img/og-cover.jpg">
|
||||
<meta property="og:image:width" content="1200">
|
||||
@@ -156,11 +160,13 @@
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<a class="skip-link" href="#main-content">Перейти к содержимому</a><div class="cookie-banner" id="cookieBanner" role="region" aria-label="Настройки аналитики" hidden>
|
||||
<a class="skip-link" href="#main-content">Перейти к содержимому</a>
|
||||
<div class="cookie-banner" id="cookieBanner" role="region" aria-label="Настройки аналитики" hidden>
|
||||
<div class="cookie-text">Разрешить аналитику для улучшения сайта? <a href="/legal#cookies">Подробнее</a>
|
||||
</div>
|
||||
<div class="cookie-actions">
|
||||
<button class="cookie-btn" id="cookieAccept" type="button">Разрешить</button><button class="cookie-btn cookie-decline" id="cookieDecline" type="button">Отклонить</button>
|
||||
<button class="cookie-btn" id="cookieAccept" type="button">Разрешить</button><button
|
||||
class="cookie-btn cookie-decline" id="cookieDecline" type="button">Отклонить</button>
|
||||
</div>
|
||||
</div>
|
||||
<header class="header">
|
||||
@@ -174,15 +180,19 @@
|
||||
<a href="/contacts" class="nav-link">Контакты</a>
|
||||
</nav>
|
||||
<a href="/contacts" class="btn btn-primary" data-goal="order_header">Заказать</a>
|
||||
<button class="burger" id="burger" aria-label="Меню" type="button" aria-expanded="false" aria-controls="nav"><span></span><span></span><span></span></button>
|
||||
<button class="burger" id="burger" aria-label="Меню" type="button" aria-expanded="false"
|
||||
aria-controls="nav"><span></span><span></span><span></span></button>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main id="main-content" tabindex="-1">
|
||||
<nav class="container breadcrumbs" aria-label="Хлебные крошки"><ol>
|
||||
<nav class="container breadcrumbs" aria-label="Хлебные крошки">
|
||||
<ol>
|
||||
<li><a href="/">Главная</a></li>
|
||||
<li><span aria-current="page">Работы</span></li>
|
||||
</ol></nav><section class="page-hero">
|
||||
</ol>
|
||||
</nav>
|
||||
<section class="page-hero">
|
||||
<div class="container">
|
||||
<h1 class="page-title">Примеры мультфильмов и рекламной анимации</h1>
|
||||
<p class="page-subtitle">Каждый мультик — это уникальная история. Смотрите примеры и вдохновляйтесь.</p>
|
||||
@@ -195,24 +205,53 @@
|
||||
<h2 class="section-title">Мультфильмы и рекламные ролики</h2>
|
||||
<div class="portfolio-grid">
|
||||
<article class="work-card ny-work" id="work-8">
|
||||
<div class="work-media"><button class="work-video" type="button" data-video="/video/video-8.webm" data-title="Новогодний экспресс" data-goal="video_open" aria-label="Смотреть видео: Новогодний экспресс">
|
||||
<img class="work-video-preview" src="/img/posters/video-8.jpg" width="960" height="1705" alt="" aria-hidden="true" loading="lazy" decoding="async">
|
||||
<span class="work-play" aria-hidden="true"><svg viewBox="0 0 24 24" width="28" height="28"><path d="M8 5.5v13l10-6.5z" fill="currentColor"></path></svg></span><span class="work-video-label">Смотреть пример · 1:18</span></button></div>
|
||||
<div class="work-info"><span class="work-tag">Новогоднее поздравление</span><h3>Новогодний экспресс</h3><p>Готовая новогодняя история с персонализацией для ребёнка. Посмотрите пример мультпоздравления.</p></div>
|
||||
<noscript><p><a href="/video/video-8.webm">Смотреть «Новогодний экспресс»</a></p></noscript>
|
||||
<div class="work-media"><button class="work-video" type="button"
|
||||
data-video="/video/video-8.webm" data-title="Новогодний экспресс" data-goal="video_open"
|
||||
aria-label="Смотреть видео: Новогодний экспресс">
|
||||
<img class="work-video-preview" src="/img/posters/video-8.jpg" width="960" height="1705"
|
||||
alt="" aria-hidden="true" loading="lazy" decoding="async">
|
||||
<span class="work-play" aria-hidden="true"><svg viewBox="0 0 24 24" width="28"
|
||||
height="28">
|
||||
<path d="M8 5.5v13l10-6.5z" fill="currentColor"></path>
|
||||
</svg></span><span class="work-video-label">Смотреть пример · 1:18</span></button>
|
||||
</div>
|
||||
<div class="work-info"><span class="work-tag">🌲 Новогоднее поздравление</span>
|
||||
<h3>Новогодний экспресс</h3>
|
||||
<p>Готовая новогодняя история с персонализацией для ребёнка. Посмотрите пример
|
||||
мультпоздравления.</p>
|
||||
</div>
|
||||
<noscript>
|
||||
<p><a href="/video/video-8.webm">Смотреть «Новогодний экспресс»</a></p>
|
||||
</noscript>
|
||||
</article>
|
||||
<article class="work-card ny-work" id="work-7">
|
||||
<div class="work-media"><button class="work-video" type="button" data-video="/video/video-7.webm" data-title="Новогодняя сказка" data-goal="video_open" aria-label="Смотреть видео: Новогодняя сказка">
|
||||
<img class="work-video-preview" src="/img/posters/video-7.jpg" width="960" height="540" alt="" aria-hidden="true" loading="lazy" decoding="async">
|
||||
<span class="work-play" aria-hidden="true"><svg viewBox="0 0 24 24" width="28" height="28"><path d="M8 5.5v13l10-6.5z" fill="currentColor"></path></svg></span><span class="work-video-label">Смотреть пример · 2:45</span></button></div>
|
||||
<div class="work-info"><span class="work-tag">Базовый пакет</span><h3>Новогодняя сказка</h3><p>Свежий пример ролика базового пакета «Новогодняя сказка».</p></div>
|
||||
<noscript><p><a href="/video/video-7.webm">Смотреть «Новогодняя сказка»</a></p></noscript>
|
||||
<div class="work-media"><button class="work-video" type="button"
|
||||
data-video="/video/video-7.webm" data-title="Новогодняя сказка" data-goal="video_open"
|
||||
aria-label="Смотреть видео: Новогодняя сказка">
|
||||
<img class="work-video-preview" src="/img/posters/video-7.jpg" width="960" height="540"
|
||||
alt="" aria-hidden="true" loading="lazy" decoding="async">
|
||||
<span class="work-play" aria-hidden="true"><svg viewBox="0 0 24 24" width="28"
|
||||
height="28">
|
||||
<path d="M8 5.5v13l10-6.5z" fill="currentColor"></path>
|
||||
</svg></span><span class="work-video-label">Смотреть пример · 2:45</span></button>
|
||||
</div>
|
||||
<div class="work-info"><span class="work-tag">🐇 Детская сказка</span>
|
||||
<h3>Новогодняя сказка</h3>
|
||||
<p>Свежий пример ролика базового пакета «Новогодняя сказка».</p>
|
||||
</div>
|
||||
<noscript>
|
||||
<p><a href="/video/video-7.webm">Смотреть «Новогодняя сказка»</a></p>
|
||||
</noscript>
|
||||
</article>
|
||||
|
||||
<article class="work-card" id="work-1">
|
||||
<div class="work-media">
|
||||
<button class="work-video" type="button" data-video="/video/video-1.webm" data-title="Реклама к открытию детского лофта" data-goal="video_open" aria-label="Смотреть видео: Реклама к открытию детского лофта">
|
||||
<img class="work-video-preview" src="/img/posters/video-1.jpg" width="640" height="360" alt="" aria-hidden="true" loading="lazy" decoding="async"><span class="work-play" aria-hidden="true"><svg viewbox="0 0 24 24" width="28" height="28">
|
||||
<button class="work-video" type="button" data-video="/video/video-1.webm"
|
||||
data-title="Реклама к открытию детского лофта" data-goal="video_open"
|
||||
aria-label="Смотреть видео: Реклама к открытию детского лофта">
|
||||
<img class="work-video-preview" src="/img/posters/video-1.jpg" width="640" height="360"
|
||||
alt="" aria-hidden="true" loading="lazy" decoding="async"><span class="work-play"
|
||||
aria-hidden="true"><svg viewbox="0 0 24 24" width="28" height="28">
|
||||
<path d="M8 5.5v13l10-6.5z" fill="currentColor"></path>
|
||||
</svg></span>
|
||||
<span class="work-video-label">Реклама</span>
|
||||
@@ -229,11 +268,18 @@
|
||||
<span>4 500 ₽</span>
|
||||
</div>
|
||||
</div>
|
||||
<noscript><p><a href="/video/video-1.webm">Открыть видео</a></p></noscript></article>
|
||||
<noscript>
|
||||
<p><a href="/video/video-1.webm">Открыть видео</a></p>
|
||||
</noscript>
|
||||
</article>
|
||||
<article class="work-card" id="work-2">
|
||||
<div class="work-media">
|
||||
<button class="work-video" type="button" data-video="/video/video-6.webm" data-title="Рекламный ролик для Детского Музея Мозга " data-goal="video_open" aria-label="Смотреть видео: Рекламный ролик для Детского Музея Мозга">
|
||||
<img class="work-video-preview" src="/img/posters/video-6.jpg" width="640" height="360" alt="" aria-hidden="true" loading="lazy" decoding="async"><span class="work-play" aria-hidden="true"><svg viewbox="0 0 24 24" width="28" height="28">
|
||||
<button class="work-video" type="button" data-video="/video/video-6.webm"
|
||||
data-title="Рекламный ролик для Детского Музея Мозга " data-goal="video_open"
|
||||
aria-label="Смотреть видео: Рекламный ролик для Детского Музея Мозга">
|
||||
<img class="work-video-preview" src="/img/posters/video-6.jpg" width="640" height="360"
|
||||
alt="" aria-hidden="true" loading="lazy" decoding="async"><span class="work-play"
|
||||
aria-hidden="true"><svg viewbox="0 0 24 24" width="28" height="28">
|
||||
<path d="M8 5.5v13l10-6.5z" fill="currentColor"></path>
|
||||
</svg></span>
|
||||
<span class="work-video-label">Мультсериал</span>
|
||||
@@ -250,11 +296,18 @@
|
||||
<span>13 500 ₽</span>
|
||||
</div>
|
||||
</div>
|
||||
<noscript><p><a href="/video/video-6.webm">Открыть видео</a></p></noscript></article>
|
||||
<noscript>
|
||||
<p><a href="/video/video-6.webm">Открыть видео</a></p>
|
||||
</noscript>
|
||||
</article>
|
||||
<article class="work-card" id="work-3">
|
||||
<div class="work-media">
|
||||
<button class="work-video" type="button" data-video="/video/video-2.webm" data-title="Приключение Саши в Звёздном саду" data-goal="video_open" aria-label="Смотреть видео: Приключение девочки Саши в Звёздном саду">
|
||||
<img class="work-video-preview" src="/img/posters/video-2.jpg" width="640" height="360" alt="" aria-hidden="true" loading="lazy" decoding="async"><span class="work-play" aria-hidden="true"><svg viewbox="0 0 24 24" width="28" height="28">
|
||||
<button class="work-video" type="button" data-video="/video/video-2.webm"
|
||||
data-title="Приключение Саши в Звёздном саду" data-goal="video_open"
|
||||
aria-label="Смотреть видео: Приключение девочки Саши в Звёздном саду">
|
||||
<img class="work-video-preview" src="/img/posters/video-2.jpg" width="640" height="360"
|
||||
alt="" aria-hidden="true" loading="lazy" decoding="async"><span class="work-play"
|
||||
aria-hidden="true"><svg viewbox="0 0 24 24" width="28" height="28">
|
||||
<path d="M8 5.5v13l10-6.5z" fill="currentColor"></path>
|
||||
</svg></span>
|
||||
<span class="work-video-label">Сказка для Саши</span>
|
||||
@@ -270,11 +323,18 @@
|
||||
<span>4 500 ₽</span>
|
||||
</div>
|
||||
</div>
|
||||
<noscript><p><a href="/video/video-2.webm">Открыть видео</a></p></noscript></article>
|
||||
<noscript>
|
||||
<p><a href="/video/video-2.webm">Открыть видео</a></p>
|
||||
</noscript>
|
||||
</article>
|
||||
<article class="work-card" id="work-4">
|
||||
<div class="work-media">
|
||||
<button class="work-video" type="button" data-video="/video/video-4.webm" data-title="Сюрприз для подруги" data-goal="video_open" aria-label="Смотреть видео: Сюрприз для подруги">
|
||||
<img class="work-video-preview" src="/img/posters/video-4.jpg" width="640" height="360" alt="" aria-hidden="true" loading="lazy" decoding="async"><span class="work-play" aria-hidden="true"><svg viewbox="0 0 24 24" width="28" height="28">
|
||||
<button class="work-video" type="button" data-video="/video/video-4.webm"
|
||||
data-title="Сюрприз для подруги" data-goal="video_open"
|
||||
aria-label="Смотреть видео: Сюрприз для подруги">
|
||||
<img class="work-video-preview" src="/img/posters/video-4.jpg" width="640" height="360"
|
||||
alt="" aria-hidden="true" loading="lazy" decoding="async"><span class="work-play"
|
||||
aria-hidden="true"><svg viewbox="0 0 24 24" width="28" height="28">
|
||||
<path d="M8 5.5v13l10-6.5z" fill="currentColor"></path>
|
||||
</svg></span>
|
||||
<span class="work-video-label">Сюрприз для подруги</span>
|
||||
@@ -290,11 +350,18 @@
|
||||
<span>3 300 ₽</span>
|
||||
</div>
|
||||
</div>
|
||||
<noscript><p><a href="/video/video-4.webm">Открыть видео</a></p></noscript></article>
|
||||
<noscript>
|
||||
<p><a href="/video/video-4.webm">Открыть видео</a></p>
|
||||
</noscript>
|
||||
</article>
|
||||
<article class="work-card" id="work-5">
|
||||
<div class="work-media">
|
||||
<button class="work-video" type="button" data-video="/video/video-5.webm" data-title="Артём и секрет настоящей победы" data-goal="video_open" aria-label="Смотреть видео: Артём и секрет настоящей победы">
|
||||
<img class="work-video-preview" src="/img/posters/video-5.jpg" width="640" height="360" alt="" aria-hidden="true" loading="lazy" decoding="async"><span class="work-play" aria-hidden="true"><svg viewbox="0 0 24 24" width="28" height="28">
|
||||
<button class="work-video" type="button" data-video="/video/video-5.webm"
|
||||
data-title="Артём и секрет настоящей победы" data-goal="video_open"
|
||||
aria-label="Смотреть видео: Артём и секрет настоящей победы">
|
||||
<img class="work-video-preview" src="/img/posters/video-5.jpg" width="640" height="360"
|
||||
alt="" aria-hidden="true" loading="lazy" decoding="async"><span class="work-play"
|
||||
aria-hidden="true"><svg viewbox="0 0 24 24" width="28" height="28">
|
||||
<path d="M8 5.5v13l10-6.5z" fill="currentColor"></path>
|
||||
</svg></span>
|
||||
<span class="work-video-label">Детская сказка</span>
|
||||
@@ -310,11 +377,18 @@
|
||||
<span>7 000 ₽</span>
|
||||
</div>
|
||||
</div>
|
||||
<noscript><p><a href="/video/video-5.webm">Открыть видео</a></p></noscript></article>
|
||||
<noscript>
|
||||
<p><a href="/video/video-5.webm">Открыть видео</a></p>
|
||||
</noscript>
|
||||
</article>
|
||||
<article class="work-card" id="work-6">
|
||||
<div class="work-media">
|
||||
<button class="work-video" type="button" data-video="/video/video-3.webm" data-title="Продакт-плейсмент к сезону отключения горячей воды" data-goal="video_open" aria-label="Смотреть видео: Продакт-плейсмент к сезону отключения горячей воды">
|
||||
<img class="work-video-preview" src="/img/posters/video-3.jpg" width="640" height="360" alt="" aria-hidden="true" loading="lazy" decoding="async"><span class="work-play" aria-hidden="true"><svg viewbox="0 0 24 24" width="28" height="28">
|
||||
<button class="work-video" type="button" data-video="/video/video-3.webm"
|
||||
data-title="Продакт-плейсмент к сезону отключения горячей воды" data-goal="video_open"
|
||||
aria-label="Смотреть видео: Продакт-плейсмент к сезону отключения горячей воды">
|
||||
<img class="work-video-preview" src="/img/posters/video-3.jpg" width="640" height="360"
|
||||
alt="" aria-hidden="true" loading="lazy" decoding="async"><span class="work-play"
|
||||
aria-hidden="true"><svg viewbox="0 0 24 24" width="28" height="28">
|
||||
<path d="M8 5.5v13l10-6.5z" fill="currentColor"></path>
|
||||
</svg></span>
|
||||
<span class="work-video-label">Для соцсетей</span>
|
||||
@@ -330,7 +404,10 @@
|
||||
<span>4 500 ₽</span>
|
||||
</div>
|
||||
</div>
|
||||
<noscript><p><a href="/video/video-3.webm">Открыть видео</a></p></noscript></article>
|
||||
<noscript>
|
||||
<p><a href="/video/video-3.webm">Открыть видео</a></p>
|
||||
</noscript>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -443,7 +520,8 @@
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<p class="container privacy-settings"><button type="button" id="cookieSettings">Настройки аналитики</button></p></main>
|
||||
<p class="container privacy-settings"><button type="button" id="cookieSettings">Настройки аналитики</button></p>
|
||||
</main>
|
||||
|
||||
<footer class="footer">
|
||||
<div class="container footer-inner">
|
||||
@@ -466,7 +544,8 @@
|
||||
<div class="footer-col">
|
||||
<h2>Связаться</h2>
|
||||
<a href="https://t.me/YuliaAnimation" target="_blank" rel="noopener">Telegram</a>
|
||||
<a href="https://www.instagram.com/olapka_animatioh?utm_source=site" target="_blank" rel="noopener">Instagram</a>
|
||||
<a href="https://www.instagram.com/olapka_animatioh?utm_source=site" target="_blank"
|
||||
rel="noopener">Instagram</a>
|
||||
<a href="https://vk.com/club240204788" target="_blank" rel="noopener">ВКонтакте</a>
|
||||
</div>
|
||||
</div>
|
||||
@@ -476,26 +555,32 @@
|
||||
</footer>
|
||||
|
||||
<!-- Видео-лайтбокс -->
|
||||
<div class="video-modal" id="videoModal" role="dialog" aria-modal="true" aria-labelledby="videoModalTitle" aria-hidden="true">
|
||||
<div class="video-modal" id="videoModal" role="dialog" aria-modal="true" aria-labelledby="videoModalTitle"
|
||||
aria-hidden="true">
|
||||
<div class="video-modal-backdrop" data-video-close></div>
|
||||
<div class="video-modal-dialog">
|
||||
<div class="video-modal-bar">
|
||||
<span class="video-modal-title" id="videoModalTitle"></span>
|
||||
<div class="video-modal-actions">
|
||||
<button class="video-modal-btn" type="button" id="videoModalFullscreen" aria-label="На весь экран" title="На весь экран">
|
||||
<button class="video-modal-btn" type="button" id="videoModalFullscreen" aria-label="На весь экран"
|
||||
title="На весь экран">
|
||||
<svg viewbox="0 0 24 24" width="22" height="22" aria-hidden="true">
|
||||
<path d="M4 9V4h5M20 9V4h-5M4 15v5h5M20 15v5h-5" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
|
||||
<path d="M4 9V4h5M20 9V4h-5M4 15v5h5M20 15v5h-5" fill="none" stroke="currentColor"
|
||||
stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
|
||||
</svg>
|
||||
</button>
|
||||
<button class="video-modal-btn" type="button" data-video-close aria-label="Закрыть" title="Закрыть (Esc)">
|
||||
<button class="video-modal-btn" type="button" data-video-close aria-label="Закрыть"
|
||||
title="Закрыть (Esc)">
|
||||
<svg viewbox="0 0 24 24" width="22" height="22" aria-hidden="true">
|
||||
<path d="M6 6l12 12M18 6L6 18" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round"></path>
|
||||
<path d="M6 6l12 12M18 6L6 18" fill="none" stroke="currentColor" stroke-width="2"
|
||||
stroke-linecap="round"></path>
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="video-modal-stage">
|
||||
<video id="videoModalPlayer" controls playsinline preload="none" tabindex="0" aria-label="Просмотр выбранного мультфильма"></video>
|
||||
<video id="videoModalPlayer" controls playsinline preload="none" tabindex="0"
|
||||
aria-label="Просмотр выбранного мультфильма"></video>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in new issue
Block a user