index.html

---
title: Home
description: The latest app to help you find new friends with common interests.
image: /images/bgimages/bg003.jpg
bottom_image: https://unsplash.it/2000/1322?a=.png
---

<section class="hero" style="background-image: url({% include relative-src.html src=page.image %})">
	<div class="inner-hero text-container">
		<div class="hero-text-container">
			<h1 class="editable">Technology for Social Innovation</h1>
			<p class="subtext editable">Code for YOKOHAMAは仲間とともに技術を磨き、学んだスキルを地域の課題解決に役立てていく活動です。横浜から価値あるソリューションを世界へ。あなたもこの活動に参加しませんか？</p>
			<div class="cta button alt"><a href="https://join.slack.com/t/code4yokohama/shared_invite/zt-e63peaf8-AIxGiecu5IgR2DHAiv~c~g">Join Now</a></div>
		</div>
	</div>
	<div class="learn-more"><a href="#learn-more">Learn more <span class="arrow">&#x25BC;</span></a></div>
</section>

<div class="content">
	<section class="info" id="learn-more">
		<div class="container flex">
			<div class="text">
				<h2 class="editable">URBAN MANAGEMENT × ICT</h2>
				<p class="editable">都市経営にICTを活用する。<br />デジタルツインやデータ分析可視化技術を駆使して横浜市の地域課題を見える化することで、より身近な問題としての認識を持ち、対策を議論しています。<br />ICT政策に対する提言をとりまとめて公開する活動もしています。</p>
				<div class="button dp-inlineblock"><a href="./projects/YokohamaToGo/">技術駆動都市ヨコハマ2030</a></div>
				<div class="button dp-inlineblock"><a href="./projects/YokohamaToGo/">市役所新庁舎VR</a></div>
			</div>
			<div class="image">
				<img class="editable" src="/images/toppage/vr.png" alt="建築前の市庁舎をVRで再現" />
			</div>
		</div>
	</section>

	<section class="info">
		<div class="container flex">
			<div class="text">
				<h2 class="editable">YOKOHAMA to Go</h2>
				<p class="editable">コロナ禍において、地域にICTをどう役立てるか。<br />地域の飲食店が苦境に立たされる中、商店会、横浜市経済局、市会議員との連携によってテイクアウト＆デリバリー情報サイト「YOKOHAMA to Go」を開発しました。</p>
				<div class="button"><a href="./projects/YokohamaToGo/">YOKOHAMA to GO</a></div>
			</div>
			<div class="image">
				<img class="editable" src="/images/toppage/yokohama_to_go.png" alt="横浜市の飲食店のテイクアウト＆デリバリー情報サイトを開発" />
			</div>
		</div>
	</section>

	<section class="info">
		<div class="container flex">
			<div class="text">
				<h2 class="editable">LEARN and SHARE</h2>
				<p class="editable">ICTに関する知識をシェアする。<br />現代社会において、ICTは技術者だけのものではありません。各種フレームワークやライブラリー、GitHubなどの勉強会を開催。横浜市職員有志グループと合同でICT相談会も開催しています。</p>
			</div>
			<div class="image">
				<img class="editable" src="/images/toppage/learn.png" alt="各種ICT勉強会を開催" />
			</div>
		</div>
	</section>

	<section class="hero" style="background-image: url({% include relative-src.html src=page.bottom_image %})">
		<div class="inner-hero text-container">
			<div class="hero-text-container">
				<h2 class="editable">FIND YOUR INTERESTS AND DIVE INTO THE PROJECT</h2>
				<p class="subtext editable">Code for YOKOAHAMではいくつものプロジェクトが同時進行しています。興味のある活動を見つけたら、遠慮無く参加してください。<br />新たなプロジェクトの提案も歓迎しています！</p>
				<div class="cta button alt"><a href="./projects/">プロジェクト一覧</a></div>
			</div>
		</div>
	</section>
</div>