website/content/_index.html

---
date: 2018-06-30T17:53:55+08:00
description: "Beep is the new way to communicate with your friends and family by merging the efficiency of voice calls with the convenience of messaging"
---

<div class="home-hero-wrapper">

	<svg width="1" height="1" viewBox="0 0 1 1" preserveAspectRatio="none" class="background-cut">
		<polygon points="0,0 1,0 0,1" style="fill:#fff" />
	</svg>

	<section class="home-hero">
		
		<div class="text">
			<h1>Talk. Don't text</h1>

			<!-- <a href="/get"><div class="btn">Get the app</div></a> -->
			<p><big>
				Beep is the new way to communicate with your friends and family by merging the efficiency of voice calls with the convenience of messaging.
			</big></p>
		</div>

		<div class="picture">
			<img class="screenshot" src="screenshot.jpg" />
		</div>

	</section>

</div>

<section class="features feature-conv" id="features">
	<div class="grow">
		<h1>Conversations, like in real life</h1>
		<p>
			Have real conversations with friends without ever making a call.
		</p>
	</div>
	<i class="material-icons">forum</i>
</section>

<section class="features feature-notif">
	<div class="grow">
		<h1>Always works, even if you are offline</h1>
		<p>
			You'll get notifications when someone contacts you. Like your familiar chat apps.
		</p>
	</div>
	<i class="material-icons">notifications</i>
</section>

<section class="features feature-hist">
	<div class="grow">
		<h1>Go back in time if you've missed something</h1>
		<p>
			Want to listen to that bad joke your friend made again and again? No problem
		</p>
	</div>
	<i class="material-icons">history</i>
</section>

<div class="getnotified-wrapper">
	<section class="getnotified" id="getnotified">

		<h1>Want to be the first to experience Beep?</h1>

		<form action="/subscribe" method="post">
			<input name="email" type="email" placeholder="Enter your email" required />
			<button type="submit" class="material-icons">done</button>
		</form>

		<p><small>We won't send you spam. Just tell you when Beep is ready.</small></p>

	</section>
</div>