Skip to content

Instantly share code, notes, and snippets.

@JunTaoLuo
Last active November 22, 2024 04:53
Show Gist options
  • Save JunTaoLuo/1217034ea9b39cc77eb342a2d8f0ed1e to your computer and use it in GitHub Desktop.
Save JunTaoLuo/1217034ea9b39cc77eb342a2d8f0ed1e to your computer and use it in GitHub Desktop.
UI/UX 推荐

UI/UX 推荐

平台

首先,考虑一下运行平台。最终大家最终怎么用你的app。

网页平台 (Web)

我推荐用Web App。这个平台有最广泛的平台支持。基本上所有的电子产品现在都有网页浏览器,所以都支持Web App。工具也很全,容易上手。而且有Javascript的背景很有优势。

移动平台 (Mobile)

这个平台包括手机,平板之类。虽然非常流行,但是一般需要特殊的开发程序。比如苹果一般用XCode和Swift/ObjC开发iOS App。安卓一般用Android Studio和Kotlin开发Android App。由于工具比较独特,而且上手比较麻烦,就算想要为移动平台服务我也不推荐这方面的开发工具。

单机平台 (Desktop)

这个平台包括单机电脑,手提电脑等,也包括所有的操作系统(Windows, Linux, macOS)。开发起来也很麻烦,跨平台更麻烦。不过现在也有些架构,比如Electron可以更方便的为这个平台写。其实Electron也适用网页技术来实现Desktop App的运行。

网页开发工具

现在的网页开发工具都已经比较成熟。我推荐用一些比较容易上手的Website Builder工具。但是先介绍一些概念。

网页建设 (Website builder)

现在最流行的网页原型设计工具是一些Website builder工具/服务,可以无代码开发基本的网页。相对来说比较好上手而且我觉得功能足够展示基本的web app功能。

当心不要用网页设计工具(Web Design tools)。因为这些工具只能设计网页的外表,但是不能提供与后端API互动功能,也不能运行网页。网页建设工具相对来说功能更全,可以设计外表,也可以运行网页和后端链接,最后有些工具还可以发表网站。

考虑点

选择工具时有些方面需要考虑一下:

可定制性 Customizability

有很多的工具由于技术限制,建设的网站只能提供基本的功能。作为原型设计,提供的基本功能应该够了,不过在选择前,可以参考一下样本网页看看功能够不够。

上手难度

与可定制性相反的方面是上手难度。功能越全面的工具,一般设置和选择都很复杂,所以也上手比较难。而上手难度低的工具,一般选项少,功能也少。

本地运行 Self-hosting

我印象中,你演示的App有一写关于本地运行的需要。大部分网页建设工具都是软件服务(SaaS: Software-as-a-Service)所以需要网络才能运行。虽然有些工具也可以export网页然后本地运行,但这有可能需要另外一套工具才能实现。有必要的话,可以先查一查怎样本地/线下运行。

插件支持 Plugin support

除了自己建设网页,好的工具有很多的插件支持。如果有很多人用,普遍的功能,模块应该可以找得到,避免自己从零开始写。

推荐

我没有用过无代码网页建设工具,但是我看了一下当前的工具觉得有两个值得试一试,WordPress和Webflow。

WordPress

alt text

Webflow是一个比较经典的网页建设工具。有很多年的技术/经验积累,而且也被广泛使用。虽然一开始是一个CMS (Content Management System)但现在也被使用建设各种功能完整的网页。虽然原来是PHP写的,现在也有不少无代码建设工具,包括本身带的Blocks和普遍用的Elementor。相关的教材和插件非常多所以上手应该不难。而且有工具支持本地运行,比如LocalWP。

功能介绍

https://www.bilibili.com/video/BV16JxfesE3Z/

Webflow

alt text

Webflow是一个比较现代的网页建设工具。建设的网页功能比较全,工具看起来也很容易用。但是目前用户相比来说还是比较少,所以教材和插件都少一些。这是一个软件服务所以需要登记账户。我看了一下好像可以本地运行,但是可能有点难度而且需要其他工具。

功能介绍

https://www.bilibili.com/video/BV1Se411j7M9/

参见

还有些不少其他的工具我就不一一介绍了。不过感兴趣也可以试一试:

Wix, Squarespace - 可以建造各种网站,跟WordPress/Webflow很相似,但是产品更偏向网页托管服务。 Shopify - 专门用来写电商网站的,功能全但是比较贵。 Carrd - 非常容易上手,但是功能很少,只能建设单页网站(Single Page Application)。

按用户数量排名,目前的工具用的人气以下:

  • 1: WordPress
  • 2: Shopify
  • 3: Wix
  • 4: Squarespace
  • ...
  • 8: Webflow
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment