zulip/templates/corporate/hello.html

256 lines
15 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

{% extends "zerver/base.html" %}
{% set entrypoint = "landing-page-hello" %}
{% set PAGE_TITLE = "Zulip — organized team chat" %}
{% set PAGE_DESCRIPTION = "Zulip is an organized team chat app, designed
for efficient communication." %}
{% block customhead %}
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
{% endblock %}
{% block content %}
{% include 'zerver/landing_nav.html' %}
<div class="portico-hello-page">
<div class='body-bg'>
<div class='body-bg__layer'></div>
</div>
<div class="screen-1">
<h1>Organized team&nbsp;chat</h1>
<div class='appshot-1'>
<picture>
<!-- dark theme is only with webp images, since webp support was at the same time or earlier than prefers-color-scheme https://caniuse.com/?search=prefers-color-scheme https://caniuse.com/webp -->
<source class='appshot-1__img'
type="image/webp"
srcset="{{ static('images/landing-page/hello/generated/screen-1-dark-1x.webp') }},
{{ static('images/landing-page/hello/generated/screen-1-dark-2x.webp') }} 2x"
media="(min-width: 941px) and (prefers-color-scheme: dark)"/>
<source class='appshot-1__img'
type="image/webp"
srcset="{{ static('images/landing-page/hello/generated/screen-1-mobile-dark-1x.webp') }},
{{ static('images/landing-page/hello/generated/screen-1-mobile-dark-2x.webp') }} 2x"
media="(max-width: 940px) and (prefers-color-scheme: dark)"/>
<source width="1095" height="496" class='appshot-1__img'
type="image/webp"
srcset="{{ static('images/landing-page/hello/generated/screen-1-1x.webp') }},
{{ static('images/landing-page/hello/generated/screen-1-2x.webp') }} 2x"
media="(min-width: 941px)"/>
<source class='appshot-1__img'
type="image/webp"
srcset="{{ static('images/landing-page/hello/generated/screen-1-mobile-1x.webp') }},
{{ static('images/landing-page/hello/generated/screen-1-mobile-2x.webp') }} 2x"
media="(max-width: 940px)"/>
<source class='appshot-1__img'
srcset="{{ static('images/landing-page/hello/generated/screen-1-mobile-1x.jpg') }},
{{ static('images/landing-page/hello/generated/screen-1-mobile-2x.jpg') }} 2x"
media="(max-width: 940px)"/>
<img alt="" width="1095" height="496" class='appshot-1__img' src="{{ static('images/landing-page/hello/generated/screen-1-1x.jpg') }}"
srcset="{{ static('images/landing-page/hello/generated/screen-1-1x.jpg') }},
{{ static('images/landing-page/hello/generated/screen-1-2x.jpg') }} 2x"/>
</picture>
<div class="cta-buttons">
<a href="/try-zulip/">
See it in use
<div class="cta-desc">in an open organization</div>
</a>
<a href="/new/">
Create organization
<div class="cta-desc">in 1 minute for free</div>
</a>
<a href="/request-demo/">
Get a demo
<div class="cta-desc">request a call</div>
</a>
</div>
</div>
<div class="client-logos">
<div class='client-logos__logo_akamai'></div>
<div class='client-logos__logo_tum'></div>
<div class='client-logos__logo_wikimedia'></div>
<div class='client-logos__logo_rust'></div>
<div class='client-logos__logo_dr_on_demand'></div>
<div class='client-logos__logo_maria'></div>
</div>
</div>
<div class="screen-2">
<div class="screen-2__container">
<div class="screen-2__content">
<h2 class="screen-2__header">What makes Zulip different</h2>
<div class="screen-2__desc">
<p>
People often tell us that traditional team chat tools (Slack, Microsoft Teams, etc.) feel chaotic and stressful.
</p>
<p>
Zulip is designed around conversations that are labeled with topics, to make communication <a href="/why-zulip/">organized and efficient</a>. Its easy to get an overview of what conversations are happening, and to read one conversation at a time.
</p>
</div>
<a class="quote" href="/case-studies/idrift/">
<div class="quote__text">
Zulip&rsquo;s <strong>threading model</strong> makes it so&nbsp;much easier to <strong>manage my team</strong>… As a&nbsp;leader, <strong>in&nbsp;just a&nbsp;few minutes</strong> I can get an overview over what&rsquo;s going on and see where my&nbsp;attention is&nbsp;needed.
</div>
<div class="quote__source">
Case study with <strong>Gaute Lund</strong>, <i>co-founder of iDrift AS</i>
</div>
</a>
</div>
<div class="appshot-2">
<picture>
<!-- dark theme is only with webp images, since webp support was at the same time or earlier than prefers-color-scheme https://caniuse.com/?search=prefers-color-scheme https://caniuse.com/webp -->
<!-- we only have mobile images here -->
<source class='appshot-2__img'
type="image/webp"
srcset="{{ static('images/landing-page/hello/generated/screen-2-mobile-dark-1x.webp') }},
{{ static('images/landing-page/hello/generated/screen-2-mobile-dark-2x.webp') }} 2x"
media="(prefers-color-scheme: dark)"/>
<source class='appshot-2__img'
type="image/webp"
srcset="{{ static('images/landing-page/hello/generated/screen-2-mobile-1x.webp') }},
{{ static('images/landing-page/hello/generated/screen-2-mobile-2x.webp') }} 2x"/>
<img alt="" class='appshot-2__img'
src="{{ static('images/landing-page/hello/generated/screen-2-mobile-1x.jpg') }}"
srcset="{{ static('images/landing-page/hello/generated/screen-2-mobile-1x.jpg') }},
{{ static('images/landing-page/hello/generated/screen-2-mobile-2x.jpg') }} 2x"/>
</picture>
</div>
</div>
</div>
<div class="screen-3">
<div class="screen-3__container">
<div class="screen-3__content">
<h2 class="screen-3__header">Zulip transforms how work gets done.</h2>
<div class="screen-3__subtitle">Check out these case studies to see the impact.</div>
<div class='screen-3__quotes'>
<a class="quote" href="/case-studies/asciidoctor/">
<div class="quote__text">
<h4>Less stress</h4>
With Zulip, I can <strong>manage hundreds of participants</strong> across two communities extremely efficiently, and I dont feel stressed.
</div>
<div class="quote__source">
<strong>Dan Allen</strong>, <i>Asciidoctor open-source project lead</i>
</div>
</a>
<a class="quote" href="/case-studies/rust/">
<div class="quote__text">
<h4>Faster decisions</h4>
Zulip lets us move faster, connect with each other better, and have interactive technical discussions that are <strong>organized, recorded, and welcoming</strong>.
</div>
<div class="quote__source">
<strong>Josh Triplett</strong>, <i>Rust Language team co-lead</i>
</div>
</a>
<a class="quote" href="/case-studies/idrift/">
<div class="quote__text">
<h4>Leaders are informed</h4>
Using Zulip significantly <strong>increases the size of the team</strong> for which a manager can meaningfully know whats going on.
</div>
<div class="quote__source">
<strong>Gaute Lund</strong>, <i>co-founder of iDrift AS</i>
</div>
</a>
<a class="quote" href="/case-studies/tum/">
<div class="quote__text">
<h4>Scalable communication</h4>
Zulip has the <strong>best user experience</strong> of all the chat apps Ive tried… It is the only app that makes hundreds of conversations manageable.
</div>
<div class="quote__source">
<strong>Tobias Lasser</strong>, <i>Technical University of Munich</i>
</div>
</a>
<a class="quote" href="/case-studies/atolio/">
<div class="quote__text">
<h4>Uninterrupted focus</h4>
In Zulip, its super <strong>easy to find</strong> things 24 hours later if you werent online when a discussion happened.
</div>
<div class="quote__source">
<strong>Gareth Watts</strong>, <i>co-founder and CTO of Atolio</i>
</div>
</a>
<a class="quote" href="/case-studies/gut-contact/">
<div class="quote__text">
<h4>Easy to use software</h4>
The software must be as simple as possible. Thats why we love Zulip.
</div>
<div class="quote__source">
<strong>Erik Dittert</strong>, <i>Head of IT at GUT contact</i>
</div>
</a>
</div>
</div>
</div>
</div>
<div class="screen-4">
<div class="screen-4__container">
<div class="screen-4__content">
<img alt="" class='switch-diagram' loading="lazy" width="400" height="358"
src="{{ static('images/landing-page/hello/switch-diagram.png') }}"
/>
<div class="screen-4__desc">
<h2 class="screen-4__header">Switching to Zulip isnt hard.</h2>
<p>
Zulip offers a convenient cloud solution, with <a href="/features/">features</a> to make your users and IT team happy. Import your data and integrations <a href="/help/import-from-slack">from Slack</a> and other products.
</p>
<h3>Your data is yours!</h3>
<p>
For ultimate control and <a href="/help/gdpr-compliance">compliance</a>, <a href="/self-hosting/">self-host</a> Zulips 100% <a href="https://github.com/zulip/zulip#readme">open-source</a> software, with easy <a href="https://zulip.readthedocs.io/en/stable/production/install.html">installation</a> and <a href="https://zulip.readthedocs.io/en/stable/production/upgrade.html">upgrades</a>.
</p>
</div>
</div>
</div>
<div class="badges">
<a class="badge-getapp" href="https://www.getapp.com/collaboration-software/web-collaboration/category-leaders/">
<img alt="" src="https://capterra.s3.amazonaws.com/assets/images/gdm-badges/ga-category_leaders-2023.png"/>
</a>
<a class="badge-capterra" href="https://www.capterra.com/p/197945/Zulip/">
<img alt="" src="{{ static('images/landing-page/hello/capterra-2023.png') }}"/>
</a>
</div>
</div>
<div class="screen-5">
<div class="screen-5__container">
<h2 class="screen-5__header">Curious to learn more?</h2>
<div class="screen-5__subtitle">Dive into our detailed guide for organizations like yours.</div>
<div class="screen-5__cards">
<a href="/for/business/" class="card">
<div class="card__text">
<h4 class="right-arrow-icon">Business</h4>
Organizations from small businesses to enterprises communicate more efficiently.
</div>
</a>
<a href="/for/research/" class="card">
<div class="card__text">
<h4 class="right-arrow-icon">Research</h4>
For your group, lab, department or scientific field.
</div>
</a>
<a href="/for/education/" class="card">
<div class="card__text">
<h4 class="right-arrow-icon">Education</h4>
Communication hub for classes, in-person or online.
</div>
</a>
<a href="/for/open-source/" class="card">
<div class="card__text">
<h4 class="right-arrow-icon">Open-source</h4>
Grow and engage your community.
</div>
</a>
<a href="/for/communities/" class="card">
<div class="card__text">
<h4 class="right-arrow-icon">Non-profits, Governments</h4>
Free or highly-discounted plans are available for most non-business uses.
</div>
</a>
<a href="/for/events/" class="card">
<div class="card__text">
<h4 class="right-arrow-icon">Events and conferences</h4>
For organizers and attendees at your conference, workshop, or hackathon.
</div>
</a>
</div>
</div>
</div>
</div>
{% include 'zerver/footer.html' %}
{% endblock %}