Skip to content

tty007/webflow-tutorial

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 

Repository files navigation

Webflow入門

Webflow-official

Webflowは、2013年に米国で創業された会社と同名のノーコードツール。 現在世界中に100万人以上のユーザーを確保し、世界中でもっとも使われるノーコードツールの1つとなっている。 Webflowを使うと、強いCMSとEC機能を持った「ピクセルパーフェクト」の優れたデザインのwebサイトを作成できる。

なにができるのか

DESIGN

カスタムパーツを用いて視覚的にWEBページを構築可能。シンボルを用いて再利用可能なパーツも定義可能。

nav-parts 各パーツは親子関係でどんな関係でパーツが設置されているか視覚的にわかるようになっている。 レスポンシブデザインにも対応可能。有料プランに入るとコード出力も可能になる。

Interaction

インタラクティブに動くアニメーションも設定可能である。パララックスデザインやプログレスバー、スクロールに合わせた複数のアニメーション定義が可能。かなり細かく設定できる。 他にも、

  • 画面をクリックしたらコンテンツを表示
  • ホバーアニメーション
  • ビルトインアニメーション(用意されたアニメーション)
  • AfterEffectsとの連携も可能

など、様々なアニメーションがある事が確認できよう。

CMS

Contents Management Systemが利用可能。デベロッパー向けに用意されている機能としては

  • WebflowのDBにJSONでアクセス可能

であるため、CMSが構築できるという訳である。

デベロッパーでなくともzapierとの連携が可能である。

<Zapierの特徴>

  • 2,000種類以上のアプリを組み合わせ、自動化?アプリを作成可能
  • コードを記載する必要はなく、選択肢を選ぶだけで誰でも簡単に作成
  • GmailやGoogle Spreadsheetなどの主要なWebサービスや、Twitter・Facebook・InstagramなどのSNSを含む2,000種類以上のアプリ・ツール・サービスが対象
  • 基本は無料で、必要量に応じて選択できる豊富なプラン

EC

WebflowではEC構築も可能である。

ec 他のサービスと比較してもスケーリングが容易に可能。

他連携サービスについて

Webflowでは外部のサービスや情報が非常に多く、学習したり実際のプロジェクトと連携したりするサービスが数多く存在する。

webflow University

webflow-university Webflowを体型的に、網羅的に学べる公式のサイトwebflow University。フォーラムも存在するので困った時はここを見ればほぼ解決しそうである。

WebDev

webdevforyou WebDev For You というサイトがある。

このサービスはwebflowj上で使える色んな表現を学習できたり、cloneで自分のプロジェクトにパーツをコピーできたりするサービスである。サブスクで値段は$11.99。

MemberStack

MemberStackは、自分のサイトに簡易的な会員機能をつける事ができるサービス。

これら以外にも様々なサードパーティサービスが存在するのがwebflowである。

About

webflowを体型的に学ぶリポジトリ

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published