mirror of
https://github.com/Sevichecc/Urara-Blog.git
synced 2025-04-30 15:49:30 +08:00
321 lines
153 KiB
HTML
321 lines
153 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh">
|
||
<head prefix="og: https://ogp.me/ns#">
|
||
<meta charset="utf-8" />
|
||
<meta name="generator" content="gh:importantimport/urara" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||
<link rel="manifest" crossorigin="use-credentials" href="/manifest.webmanifest" />
|
||
<link rel="alternate" type="application/feed+json" href="/feed.json" />
|
||
<link rel="alternate" type="application/atom+xml" href="/atom.xml" />
|
||
<link rel="sitemap" type="application/xml" href="/sitemap.xml" />
|
||
<meta http-equiv="content-security-policy" content=""><title>Evaluation | Seviche.cc</title><link rel="me" href="https://kongwoo.icu/@seviche" data-svelte="svelte-1592q3p"><link rel="webmention" href="https://webmention.io/seviche.cc/webmention" data-svelte="svelte-1592q3p">
|
||
<link rel="pingback" href="https://webmention.io/seviche.cc/xmlrpc" data-svelte="svelte-1592q3p"><link rel="shortcut icon" href="https://seviche.cc/favicon.png" sizes="48x48" type="image/png" data-svelte="svelte-1kxdj3d"><link rel="apple-touch-icon" href="https://seviche.cc/assets/any@180.png" sizes="180x180" type="image/png" data-svelte="svelte-1kxdj3d"><link rel="icon" href="https://seviche.cc/assets/any@192.png" sizes="192x192" type="image/png" data-svelte="svelte-1kxdj3d"><meta name="theme-color" data-svelte="svelte-1g590ms"><meta name="author" content="酸橘汁腌鱼" data-svelte="svelte-abrfj"><link rel="canonical" href="https://seviche.cc/2021-11-18-ux5" data-svelte="svelte-abrfj">
|
||
|
||
<meta name="keywords" content="UX" data-svelte="svelte-abrfj">
|
||
<meta name="description" content="Introduction to User Experience Design｜Week5" data-svelte="svelte-abrfj"><!-- HTML_TAG_START --><link rel="authorization_endpoint" href="https://indieauth.com/auth"><!-- HTML_TAG_END --><!-- HTML_TAG_START --><link rel="token_endpoint" href="https://tokens.indieauth.com/token"><!-- HTML_TAG_END --><!-- HTML_TAG_START --><link rel="me" href="https://github.com/sevichecc" /><!-- HTML_TAG_END --><!-- HTML_TAG_START --><script data-cfasync="false" defer data-do-not-track="true" data-website-id="2403ea30-74ff-4ffa-8264-556b9f3b2897" src="https://hexoverc.vercel.app/umami.js"></script><!-- HTML_TAG_END --><!-- HTML_TAG_START --><script async data-cfasync="false" src="https://cdn.splitbee.io/sb.js"></script><!-- HTML_TAG_END --><!-- HTML_TAG_START --><meta name="baiduspider" content="noindex"><!-- HTML_TAG_END --><!-- HTML_TAG_START --><link rel="microsub" href="https://aperture.p3k.io/microsub/761"><!-- HTML_TAG_END --><meta property="og:site_name" content="Seviche.cc" data-svelte="svelte-1y1uq0g"><meta property="og:locale" content="zh" data-svelte="svelte-1y1uq0g"><meta property="og:type" content="article" data-svelte="svelte-1y1uq0g">
|
||
<meta property="og:title" content="Evaluation" data-svelte="svelte-1y1uq0g">
|
||
<meta property="og:description" content="Introduction to User Experience Design｜Week5" data-svelte="svelte-1y1uq0g">
|
||
<meta property="og:image" content="https://seviche.cc/assets/maskable@512.png" data-svelte="svelte-1y1uq0g">
|
||
<meta name="twitter:card" content="summary" data-svelte="svelte-1y1uq0g">
|
||
<meta property="article:tag" content="UX" data-svelte="svelte-1y1uq0g">
|
||
<meta property="og:url" content="https://seviche.cc/2021-11-18-ux5" data-svelte="svelte-1y1uq0g">
|
||
<meta property="article:author" content="酸橘汁腌鱼" data-svelte="svelte-1y1uq0g">
|
||
<meta property="article:published_time" content="2021-11-18T14:09:49.000Z" data-svelte="svelte-1y1uq0g">
|
||
<meta property="article:modified_time" content="2022-08-06T10:47:38.841Z" data-svelte="svelte-1y1uq0g">
|
||
<link href="/_app/immutable/assets/__layout-916a0572.css" rel="stylesheet">
|
||
<link rel="modulepreload" href="/_app/immutable/start-4ad7effd.js">
|
||
<link rel="modulepreload" href="/_app/immutable/chunks/index-cd58b8d1.js">
|
||
<link rel="modulepreload" href="/_app/immutable/chunks/index-81c83cec.js">
|
||
<link rel="modulepreload" href="/_app/immutable/pages/__layout.svelte-251b91cc.js">
|
||
<link rel="modulepreload" href="/_app/immutable/chunks/title-765c989f.js">
|
||
<link rel="modulepreload" href="/_app/immutable/chunks/posts-c52cb603.js">
|
||
<link rel="modulepreload" href="/_app/immutable/chunks/posts-57ab4794.js">
|
||
<link rel="modulepreload" href="/_app/immutable/chunks/icon-3aa13b39.js">
|
||
<link rel="modulepreload" href="/_app/immutable/pages/2021-11-18-ux5/index.md-81ba81fb.js">
|
||
<link rel="modulepreload" href="/_app/immutable/chunks/post_layout-9085e57e.js">
|
||
<link rel="modulepreload" href="/_app/immutable/chunks/post_card-e7f4525a.js">
|
||
<link rel="modulepreload" href="/_app/immutable/chunks/head-4a058b17.js">
|
||
<link rel="modulepreload" href="/_app/immutable/chunks/footer-1abd9501.js">
|
||
</head>
|
||
|
||
<body itemscope itemtype="https://schema.org/WebPage">
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
|
||
<header id="header" class="fixed z-50 w-screen transition-all duration-500 ease-in-out border-b-2 border-transparent max-h-[4.125rem] false"><div class="navbar"><div class="navbar-start"><div class="dropdown lg:hidden"><label for="navbar-dropdown" tabindex="0" class="btn btn-square btn-ghost"><span class="i-heroicons-outline-menu-alt-1"></span></label>
|
||
<ul id="navbar-dropdown" tabindex="0" class="menu menu-compact dropdown-content bg-base-100 text-base-content shadow-lg rounded-box max-w-52 p-2"><li><a sveltekit:prefetch href="/projects">Projects</a>
|
||
</li><li><a sveltekit:prefetch href="/friends">Friends</a>
|
||
</li><li><a sveltekit:prefetch href="/about">About</a>
|
||
</li></ul></div>
|
||
<div class="swap order-last hidden lg:inline-grid"><button class="swap-on btn btn-ghost text-base font-normal normal-case transition-all duration-200 hidden"></button>
|
||
<ul class="swap-off menu menu-horizontal p-0"><li><a sveltekit:prefetch href="/projects">Projects</a>
|
||
</li><li><a sveltekit:prefetch href="/friends">Friends</a>
|
||
</li><li><a sveltekit:prefetch href="/about">About</a>
|
||
</li></ul></div>
|
||
<a href="/" sveltekit:prefetch class="btn btn-ghost normal-case text-lg">Seviche.cc</a></div>
|
||
<div class="navbar-end">
|
||
|
||
|
||
|
||
|
||
<div id="change-theme" class="dropdown dropdown-end"><div tabindex="0" class="btn btn-square btn-ghost"><span class="i-heroicons-outline-color-swatch"></span></div>
|
||
<ul tabindex="0" class="flex shadow-2xl menu dropdown-content bg-base-100 text-base-content rounded-box w-52 p-2 gap-2 overflow-y-auto max-h-[21.5rem]"><button data-theme="lemonade" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Light</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="night" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Dark</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="cupcake" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Cupcake</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="bumblebee" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Bumblebee</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="emerald" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Emerald</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="corporate" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Corporate</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="valentine" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Valentine</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="synthwave" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Synthwave</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="retro" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Retro</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="cyberpunk" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Cyberpunk</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="halloween" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Halloween</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="garden" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Garden</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="forest" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Forest</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="aqua" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Aqua</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="lofi" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Lo-Fi</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="pastel" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Pastel</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="fantasy" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Fantasy</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="wirefream" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Wireframe</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="black" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Black</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="luxury" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Luxury</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="dracula" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Dracula</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="cmyk" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">CMYK</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="autumn" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Autumn</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="business" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Business</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="acid" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Acid</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="coffee" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Coffee</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button><button data-theme="winter" class="btn btn-ghost hover:bg-primary group rounded-lg flex bg-base-100 p-2 transition-all"><p class="flex-1 text-left text-base-content group-hover:text-primary-content transition-color">Winter</p>
|
||
<div class="flex-none m-auto flex gap-1"><div class="bg-primary w-2 h-4 rounded"></div>
|
||
<div class="bg-secondary w-2 h-4 rounded"></div>
|
||
<div class="bg-accent w-2 h-4 rounded"></div>
|
||
<div class="bg-neutral w-2 h-4 rounded"></div></div>
|
||
</button></ul></div></div></div></header>
|
||
|
||
<button id="totop" aria-label="scroll to top" class="fixed grid group btn btn-circle btn-lg border-none backdrop-blur bottom-6 right-6 z-50 duration-500 ease-in-out btn-ghost bg-base-100/30 md:bg-base-200/30 translate-y-24"><div class="radial-progress text-accent transition-all duration-500 ease-in-out group-hover:text-accent-focus col-start-1 row-start-1" style="--size:4rem; --thickness: 0.25rem; --value:undefined;"></div>
|
||
<div class="border-4 border-base-content/10 group-hover:border-transparent col-start-1 row-start-1 rounded-full w-full h-full p-4 grid duration-500 ease-in-out"><span class="i-heroicons-solid-chevron-up !w-6 !h-6"></span></div></button>
|
||
|
||
<div class="bg-base-100 md:bg-base-200 min-h-screen pt-16 md:pb-8 lg:pb-16">
|
||
|
||
|
||
|
||
<div class="flex flex-col flex-nowrap justify-center xl:flex-row xl:flex-wrap"><div class="flex-1 w-full max-w-screen-md order-first ease-out transform mx-auto xl:mr-0"></div>
|
||
<div class="flex-1 w-full max-w-screen-md xl:order-last ease-out transform mx-auto xl:mr-0"></div>
|
||
<div class="flex-none w-full max-w-screen-md mx-auto xl:mx-0"><article itemscope itemtype="https://schema.org/BlogPosting" itemprop="blogPost" class="card bg-base-100 rounded-none md:rounded-box md:shadow-xl z-10 md:mb-8 lg:mb-16"><div id="bridgy" class="hidden"><a href="https://brid.gy/publish/mastodon">mastodon</a></div>
|
||
|
||
|
||
<div class="card-body gap-0 "><div class="flex flex-col gap-2">
|
||
<div class="flex font-semibold gap-1.5"><a rel="author" class="opacity-75 hover:opacity-100 hover:text-primary duration-500 ease-in-out p-author h-card" href="https://seviche.cc">酸橘汁腌鱼</a>
|
||
<span class="opacity-50">/</span>
|
||
<a href="/2021-11-18-ux5" class="swap hover:swap-active u-url u-uid"><time class="swap-off font-semibold opacity-75 duration-500 ease-in-out mr-auto dt-published" datetime="2021-11-18T14:09:49.000Z" itemprop="datePublished">Thu, Nov 18, 2021</time>
|
||
<time class="swap-on font-semibold text-primary duration-500 ease-in-out mr-auto dt-updated" datetime="2022-08-06T10:47:38.841Z" itemprop="dateModified">Sat, Aug 6, 2022</time></a></div>
|
||
<h1 itemprop="name headline" class="card-title text-3xl mb-8 p-name">Evaluation</h1>
|
||
<p itemprop="description" class="p-summary mb-auto hidden">Introduction to User Experience Design｜Week5</p></div>
|
||
<main itemprop="articleBody" class="urara-prose prose e-content"><h2 id="评估"><a href="#评估"><strong>评估</strong></a></h2>
|
||
<ul><li>可以确定我们正在改善用户的体验</li>
|
||
<li>需要定性、定量的数据</li></ul>
|
||
<h2 id="分类"><a href="#分类"><strong>分类</strong></a></h2>
|
||
<h3 id="形成性评估"><a href="#形成性评估">形成性评估</a></h3>
|
||
<ul><li>在设计<strong>低保真</strong>原型的过程中进行的</li>
|
||
<li>数据：( 例如：完成任务的时间或点击次数）（关注任务）</li>
|
||
<li>环境：一个受控环境, 例如, 实验室或办公室</li></ul>
|
||
<h3 id="总结性评估"><a href="#总结性评估">总结性评估</a></h3>
|
||
<ul><li>是在<strong>高保真</strong>原型或最终界面即将完成的情况下进行的。</li>
|
||
<li>数据：设计者能够访问的和分析的数据， 它们可以告诉我们如何使用系统。 例如，用户开始和结束会话时可能会有时间戳， 并记录用户如何与系统交互的数据（真实场景）、</li>
|
||
<li>场景：高保真原型可在野外进行，如真实的使用场景</li></ul>
|
||
<h2 id="如何评估"><a href="#如何评估"><strong>如何评估</strong></a></h2>
|
||
<h3 id="数据收集"><a href="#数据收集">数据收集</a></h3>
|
||
<ul><li>以问卷形式进行的定量数据,</li>
|
||
<li>记录用户完成任务时所经过的路径的数据。</li>
|
||
<li>用户访谈的形式获得的定性数据</li></ul>
|
||
<h3 id="衡量"><a href="#衡量">衡量</a></h3>
|
||
<ul><li>衡量任务的目标所达到的程度（完成程度）</li>
|
||
<li>包括完成任务的时间、单击次数或 执行任务时出现的错误数。</li></ul>
|
||
<h3 id="可学习性"><a href="#可学习性">可学习性</a></h3>
|
||
<ul><li>定义：首次成功完成任务的简单程度。</li>
|
||
<li>衡量：完成任务的点击次数、完成任务所需的时间量来获得客观的测量结果， 然后将这些数据与专家的表现进行比较。</li></ul>
|
||
<h3 id="可记忆性"><a href="#可记忆性">可记忆性</a></h3>
|
||
<ul><li>定义：要记住产品用方法的难易程度（如何在反复试验之后在界面上执行给定的任务）</li>
|
||
<li>衡量：时间量或点击次数（完成一项反复试验的任务, 以获得可记忆性的测量）</li></ul>
|
||
<h3 id="主观情感评估"><a href="#主观情感评估">主观情感评估</a></h3>
|
||
<p><img src="/2021-11-18-ux5/1.png" alt="/2021-11-18-ux5/1.png" class="rounded-lg my-2" loading="lazy" decoding="async"></p>
|
||
<ul><li>认知测量：心理负担</li>
|
||
<li>情感测量：情感体验</li></ul>
|
||
<h2 id="相关资源"><a href="#相关资源"><strong>相关资源</strong></a></h2>
|
||
<ol><li><a href="http://www.usability.gov/what-and-why/usability-evaluation.html" rel="nofollow noopener noreferrer external" target="_blank">usability evaluation</a></li>
|
||
<li><a href="https://www.interaction-design.org/literature/book/the-encyclopedia-of-human-computer-interaction-2nd-ed/usability-evaluation" rel="nofollow noopener noreferrer external" target="_blank">15. Usability Evaluation</a></li>
|
||
<li><a href="http://www.wqusability.com/articles/more-than-ease-of-use.html" rel="nofollow noopener noreferrer external" target="_blank">more than ease of use</a></li>
|
||
<li><a href="http://www.diku.dk/~kash/papers/CHI2000_froekjaer.pdf" rel="nofollow noopener noreferrer external" target="_blank">Measuring Usability: Are Effectiveness, Efficiency, and Satisfaction Really Correlated?</a></li>
|
||
<li><a href="https://www.nngroup.com/articles/usability-101-introduction-to-usability/" rel="nofollow noopener noreferrer external" target="_blank">usability 101|introduction to usability/</a></li></ol>
|
||
<h2 id="推荐教材"><a href="#推荐教材"><strong>推荐教材</strong></a></h2>
|
||
<h3 id="trade-book"><a href="#trade-book">Trade Book</a></h3>
|
||
<ul><li><strong>The Design of Everyday Things</strong>
|
||
2013 edition by Don Norman</li></ul>
|
||
<h3 id="text-books"><a href="#text-books">Text Books</a></h3>
|
||
<ul><li><strong>Interaction Design</strong><ul><li>by Jennifer Preece, Helen Sharp and Yvonne Rogers (in alphabetical order).</li>
|
||
<li>There are four editions of this book. I believe any of the editions are a good purchase. This is the book I use in my undergraduate college course.</li></ul></li>
|
||
<li><strong>Human Computer Interaction</strong><ul><li>2004 by Dix, Finlay, Abowd & Beale.</li>
|
||
<li>This is an advance text book.</li></ul></li>
|
||
<li><strong>Understanding Your Users</strong><ul><li>2015 edition by Baxter, Courage & Caine.</li>
|
||
<li>I really like this book because it does what it claims, provides a “practical guide to User Research Methods</li></ul></li></ul>
|
||
<h2 id="参考网站"><a href="#参考网站"><strong>参考网站</strong></a></h2>
|
||
<ul><li><a href="http://www.usabilitybok.org/what-is-usability" rel="nofollow noopener noreferrer external" target="_blank">What is Usability? | Usability Body of Knowledge</a></li>
|
||
<li><a href="https://en.wikipedia.org/wiki/User_interface_design" rel="nofollow noopener noreferrer external" target="_blank">User interface design - Wikipedia</a></li>
|
||
<li><a href="https://en.wikipedia.org/wiki/User_experience_design" rel="nofollow noopener noreferrer external" target="_blank">User experience design - Wikipedia</a></li>
|
||
<li><a href="http://www.usabilityfirst.com/" rel="nofollow noopener noreferrer external" target="_blank">Usability First: Usability in Website and Software Design</a></li>
|
||
<li><a href="http://www.usability.gov/how-to-and-tools/methods/index.html" rel="nofollow noopener noreferrer external" target="_blank">Methods</a></li></ul></main>
|
||
<div class="divider mt-4 mb-0"></div>
|
||
<div><a href="/?tags=UX" class="btn btn-sm btn-ghost normal-case mt-2 mr-2 p-category">#UX
|
||
</a></div></div>
|
||
|
||
</article>
|
||
<footer id="footer" class="footer footer-center bg-base-300 text-base-content shadow-inner p-8 md:rounded-box sticky bottom-0 z-0 md:static "><div class="prose"><p><a href="/atom.xml" rel="noopener external" target="_blank">Feed</a>
|
||
<span class="mr-1">·</span><a href="/sitemap.xml" rel="noopener external" target="_blank">Sitemap</a>
|
||
<span class="mr-1">·</span><a href="/privacy" rel="noopener external" target="_blank">Pravicy</a>
|
||
|
||
<br>
|
||
Copyright © 2022
|
||
酸橘汁腌鱼
|
||
<br>
|
||
Powered by
|
||
<a rel="noopener external" target="_blank" class="tooltip tooltip-secondary hover:text-secondary" data-tip="🌸 [δ] - Based on MDsveX & SvelteKit 🌸" href="https://github.com/importantimport/urara">Urara
|
||
</a>
|
||
<br>
|
||
<!-- HTML_TAG_START --><a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/4.0/">CC BY-NC-SA 4.0</a><!-- HTML_TAG_END --></p></div></footer></div></div></div>
|
||
|
||
|
||
<script type="module" data-sveltekit-hydrate="1f06ur8">
|
||
import { set_public_env, start } from "/_app/immutable/start-4ad7effd.js";
|
||
|
||
set_public_env({});
|
||
|
||
start({
|
||
target: document.querySelector('[data-sveltekit-hydrate="1f06ur8"]').parentNode,
|
||
paths: {"base":"","assets":""},
|
||
session: {},
|
||
route: true,
|
||
spa: false,
|
||
trailing_slash: "never",
|
||
hydrate: {
|
||
status: 200,
|
||
error: null,
|
||
nodes: [0, 6],
|
||
params: {},
|
||
routeId: "2021-11-18-ux5"
|
||
}
|
||
});
|
||
</script><script type="application/json" sveltekit:data-type="data" sveltekit:data-url="/posts.json">{"status":200,"statusText":"","headers":{"content-type":"application/json; charset=utf-8"},"body":"[\n {\n \"title\": \"Vue.js 挑战练习\",\n \"created\": \"2022-08-12T00:00:00.000Z\",\n \"summary\": \"我的答案以及相关知识点\",\n \"tags\": [\n \"Vue\"\n ],\n \"slug\": \"/2022-08-12-vue-challenges.md\",\n \"path\": \"/2022-08-12-vue-challenges\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"Built-ins\",\n \"slug\": \"built-ins\"\n },\n {\n \"depth\": 3,\n \"title\": \"DOM 传送门\",\n \"slug\": \"dom-传送门\"\n },\n {\n \"depth\": 3,\n \"title\": \"优化性能的指令\",\n \"slug\": \"优化性能的指令\"\n },\n {\n \"depth\": 2,\n \"title\": \"CSS Features\",\n \"slug\": \"css-features\"\n },\n {\n \"depth\": 3,\n \"title\": \"动态 CSS\",\n \"slug\": \"动态-css\"\n },\n {\n \"depth\": 3,\n \"title\": \"全局 CSS\",\n \"slug\": \"全局-css\"\n },\n {\n \"depth\": 2,\n \"title\": \"Components\",\n \"slug\": \"components\"\n },\n {\n \"depth\": 3,\n \"title\": \"DOM 传送门\",\n \"slug\": \"dom-传送门-1\"\n },\n {\n \"depth\": 3,\n \"title\": \"Props 验证\",\n \"slug\": \"props-验证\"\n },\n {\n \"depth\": 3,\n \"title\": \"函数式组件\",\n \"slug\": \"函数式组件\"\n },\n {\n \"depth\": 3,\n \"title\": \"渲染函数h()\",\n \"slug\": \"渲染函数h\"\n },\n {\n \"depth\": 3,\n \"title\": \"树组件\",\n \"slug\": \"树组件\"\n },\n {\n \"depth\": 2,\n \"title\": \"Composable Function\",\n \"slug\": \"composable-function\"\n },\n {\n \"depth\": 3,\n \"title\": \"切换器\",\n \"slug\": \"切换器\"\n },\n {\n \"depth\": 3,\n \"title\": \"计数器\",\n \"slug\": \"计数器\"\n },\n {\n \"depth\": 3,\n \"title\": \"实现本地存储函数\",\n \"slug\": \"实现本地存储函数\"\n },\n {\n \"depth\": 3,\n \"title\": \"鼠标坐标\",\n \"slug\": \"鼠标坐标\"\n },\n {\n \"depth\": 2,\n \"title\": \"Composition API\",\n \"slug\": \"composition-api\"\n },\n {\n \"depth\": 3,\n \"title\": \"生命周期钩子\",\n \"slug\": \"生命周期钩子\"\n },\n {\n \"depth\": 3,\n \"title\": \"ref 全家桶\",\n \"slug\": \"ref-全家桶\"\n },\n {\n \"depth\": 3,\n \"title\": \"响应性丢失\",\n \"slug\": \"响应性丢失\"\n },\n {\n \"depth\": 3,\n \"title\": \"可写的计算属性\",\n \"slug\": \"可写的计算属性\"\n },\n {\n \"depth\": 3,\n \"title\": \"watch 全家桶\",\n \"slug\": \"watch-全家桶\"\n },\n {\n \"depth\": 3,\n \"title\": \"浅层 ref\",\n \"slug\": \"浅层-ref\"\n },\n {\n \"depth\": 3,\n \"title\": \"依赖注入\",\n \"slug\": \"依赖注入\"\n },\n {\n \"depth\": 3,\n \"title\": \"Effect 作用域 API\",\n \"slug\": \"effect-作用域-api\"\n },\n {\n \"depth\": 3,\n \"title\": \"自定义 ref\",\n \"slug\": \"自定义-ref\"\n },\n {\n \"depth\": 2,\n \"title\": \"Directives\",\n \"slug\": \"directives\"\n },\n {\n \"depth\": 3,\n \"title\": \"大写\",\n \"slug\": \"大写\"\n },\n {\n \"depth\": 3,\n \"title\": \"优化性能的指令\",\n \"slug\": \"优化性能的指令-1\"\n },\n {\n \"depth\": 3,\n \"title\": \"切换焦点指令\",\n \"slug\": \"切换焦点指令\"\n },\n {\n \"depth\": 3,\n \"title\": \"防抖点击指令\",\n \"slug\": \"防抖点击指令\"\n },\n {\n \"depth\": 3,\n \"title\": \"激活的样式-指令\",\n \"slug\": \"激活的样式-指令\"\n },\n {\n \"depth\": 3,\n \"title\": \"实现简易版v-model指令\",\n \"slug\": \"实现简易版v-model指令\"\n },\n {\n \"depth\": 2,\n \"title\": \"Event Handling\",\n \"slug\": \"event-handling\"\n },\n {\n \"depth\": 3,\n \"title\": \"阻止事件冒泡\",\n \"slug\": \"阻止事件冒泡\"\n },\n {\n \"depth\": 3,\n \"title\": \"按键修饰符\",\n \"slug\": \"按键修饰符\"\n },\n {\n \"depth\": 2,\n \"title\": \"Global API:General\",\n \"slug\": \"global-apigeneral\"\n },\n {\n \"depth\": 3,\n \"title\": \"下一次 DOM 更新\",\n \"slug\": \"下一次-dom-更新\"\n },\n {\n \"depth\": 2,\n \"title\": \"Lifecycle\",\n \"slug\": \"lifecycle\"\n },\n {\n \"depth\": 3,\n \"title\": \"生命周期钩子\",\n \"slug\": \"生命周期钩子-1\"\n },\n {\n \"depth\": 2,\n \"title\": \"Reactivity:Advanced\",\n \"slug\": \"reactivityadvanced\"\n },\n {\n \"depth\": 3,\n \"title\": \"浅层 ref\",\n \"slug\": \"浅层-ref-1\"\n },\n {\n \"depth\": 3,\n \"title\": \"原始值 API\",\n \"slug\": \"原始值-api\"\n },\n {\n \"depth\": 3,\n \"title\": \"Effect 作用域 API\",\n \"slug\": \"effect-作用域-api-1\"\n },\n {\n \"depth\": 3,\n \"title\": \"自定义 ref\",\n \"slug\": \"自定义-ref-1\"\n },\n {\n \"depth\": 2,\n \"title\": \"Reactivity:Core\",\n \"slug\": \"reactivitycore\"\n },\n {\n \"depth\": 3,\n \"title\": \"ref 全家桶\",\n \"slug\": \"ref-全家桶-1\"\n },\n {\n \"depth\": 3,\n \"title\": \"可写的计算属性\",\n \"slug\": \"可写的计算属性-1\"\n },\n {\n \"depth\": 3,\n \"title\": \"watch 全家桶\",\n \"slug\": \"watch-全家桶-1\"\n },\n {\n \"depth\": 2,\n \"title\": \"Reactivity:Utilities\",\n \"slug\": \"reactivityutilities\"\n },\n {\n \"depth\": 3,\n \"title\": \"响应性丟失\",\n \"slug\": \"响应性丟失\"\n },\n {\n \"depth\": 2,\n \"title\": \"Utility Function\",\n \"slug\": \"utility-function\"\n },\n {\n \"depth\": 3,\n \"title\": \"until\",\n \"slug\": \"until\"\n },\n {\n \"depth\": 2,\n \"title\": \"Web Components\",\n \"slug\": \"web-components\"\n },\n {\n \"depth\": 3,\n \"title\": \"自定义元素\",\n \"slug\": \"自定义元素\"\n }\n ],\n \"updated\": \"2022-08-13T08:21:08.878Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"Monkey Patch\",\n \"created\": \"2022-08-06T00:00:00.000Z\",\n \"summary\": \"猴子打补丁\",\n \"toc\": false,\n \"tag\": [\n \"Notes\"\n ],\n \"slug\": \"/2022-08-06-notes/index.md\",\n \"path\": \"/2022-08-06-notes\",\n \"updated\": \"2022-08-07T04:36:02.907Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"我在看什么 · 7 月\",\n \"created\": \"2022-07-31T00:00:00.000Z\",\n \"summary\": \"eval / CSP&XSS / Commonplace Book ……\",\n \"tags\": [\n \"我在看什么\"\n ],\n \"image\": \"/2022-07-31-reading-7/july.webp\",\n \"slug\": \"/2022-07-31-reading-7/index.md\",\n \"path\": \"/2022-07-31-reading-7\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"前端\",\n \"slug\": \"前端\"\n },\n {\n \"depth\": 2,\n \"title\": \"后端\",\n \"slug\": \"后端\"\n },\n {\n \"depth\": 2,\n \"title\": \"什锦\",\n \"slug\": \"什锦\"\n },\n {\n \"depth\": 2,\n \"title\": \"Commonplace Book\",\n \"slug\": \"commonplace-book\"\n }\n ],\n \"updated\": \"2022-08-06T11:32:41.119Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"JS中的二进制数字\",\n \"created\": \"2022-07-27T00:00:00.000Z\",\n \"summary\": \"0b/0B和paresInt\",\n \"tags\": [\n \"JavsScript\"\n ],\n \"slug\": \"/2022-07-27-bin.md\",\n \"path\": \"/2022-07-27-bin\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"ES6+\",\n \"slug\": \"es6\"\n },\n {\n \"depth\": 2,\n \"title\": \"Before ES6\",\n \"slug\": \"before-es6\"\n }\n ],\n \"updated\": \"2022-08-11T17:12:21.128Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"created\": \"2022-07-26T00:00:00.000Z\",\n \"tags\": [\n \"XSS\",\n \"Notes\"\n ],\n \"slug\": \"/2022-07-23-notes-xss.md\",\n \"path\": \"/2022-07-23-notes-xss\",\n \"toc\": [\n {\n \"depth\": 3,\n \"title\": \"XSS 学习\",\n \"slug\": \"xss-学习\"\n }\n ],\n \"updated\": \"2022-08-11T17:39:51.841Z\",\n \"type\": \"note\",\n \"html\": \"\u003Ch3 id=\\\"xss-学习\\\">\u003Ca href=\\\"#xss-学习\\\">XSS 学习\u003C/a>\u003C/h3>\u003Cp>介绍文章：\u003C/p>\u003Cul>\u003Cli>\u003Ca href=\\\"https://tech.meituan.com/2018/09/27/fe-security.html\\\" rel=\\\"nofollow noopener noreferrer external\\\" target=\\\"_blank\\\">前端安全系列（一）：如何防止 XSS 攻击？ - 美团技术团队\u003C/a>\u003C/li>\u003Cli>\u003Ca href=\\\"https://developer.mozilla.org/zh-CN/docs/Glossary/Cross-site_scripting\\\" rel=\\\"nofollow noopener noreferrer external\\\" target=\\\"_blank\\\">Cross-site scripting（跨站脚本攻击） - 术语表 | MDN\u003C/a>\u003C/li>\u003C/ul>\u003Cp>练习：\u003C/p>\u003Cul>\u003Cli>\u003Ca href=\\\"https://prompt.ml/\\\" rel=\\\"nofollow noopener noreferrer external\\\" target=\\\"_blank\\\">prompt(1) to win\u003C/a>\u003C/li>\u003Cli>解答：\u003Ca href=\\\"https://github.com/cure53/XSSChallengeWiki/wiki/prompt.ml#level-1\\\" rel=\\\"nofollow noopener noreferrer external\\\" target=\\\"_blank\\\">prompt.ml\u003C/a>\u003C/li>\u003C/ul>\u003Cp>相关文章：\u003C/p>\u003Cul>\u003Cli>\u003Ca href=\\\"https://www.leavesongs.com/PENETRATION/xss-from-my-blog.html\\\" rel=\\\"nofollow noopener noreferrer external\\\" target=\\\"_blank\\\">我自己博客的一个 XSS 的故事 | 离别歌\u003C/a>\u003C/li>\u003C/ul>\"\n },\n {\n \"title\": \"D3.js 基础笔记\",\n \"created\": \"2022-07-23T00:00:00.000Z\",\n \"summary\": \"即使是FreeCodeCamp也要做笔记\",\n \"tags\": [\n \"D3.js\",\n \"数据可视化\"\n ],\n \"slug\": \"/2022-07-23-d3.md\",\n \"path\": \"/2022-07-23-d3\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"学习资源\",\n \"slug\": \"学习资源\"\n },\n {\n \"depth\": 2,\n \"title\": \"基础操作\",\n \"slug\": \"基础操作\"\n },\n {\n \"depth\": 3,\n \"title\": \"修改元素\",\n \"slug\": \"修改元素\"\n },\n {\n \"depth\": 3,\n \"title\": \"使用数据\",\n \"slug\": \"使用数据\"\n },\n {\n \"depth\": 3,\n \"title\": \"使用动态数据\",\n \"slug\": \"使用动态数据\"\n },\n {\n \"depth\": 3,\n \"title\": \"给元素添加内联样式\",\n \"slug\": \"给元素添加内联样式\"\n },\n {\n \"depth\": 3,\n \"title\": \"添加 Class\",\n \"slug\": \"添加-class\"\n },\n {\n \"depth\": 3,\n \"title\": \"标签\",\n \"slug\": \"标签\"\n },\n {\n \"depth\": 3,\n \"title\": \"添加工具提示 tooltip\",\n \"slug\": \"添加工具提示-tooltip\"\n },\n {\n \"depth\": 2,\n \"title\": \"SVG\",\n \"slug\": \"svg\"\n },\n {\n \"depth\": 3,\n \"title\": \"创建 SVG\",\n \"slug\": \"创建-svg\"\n },\n {\n \"depth\": 3,\n \"title\": \"反转 SVG 元素\",\n \"slug\": \"反转-svg-元素\"\n },\n {\n \"depth\": 3,\n \"title\": \"更改 SVG 元素的颜色\",\n \"slug\": \"更改-svg-元素的颜色\"\n },\n {\n \"depth\": 3,\n \"title\": \"SVG 图形\",\n \"slug\": \"svg-图形\"\n },\n {\n \"depth\": 4,\n \"title\": \"矩形\",\n \"slug\": \"矩形\"\n },\n {\n \"depth\": 4,\n \"title\": \"圆形\",\n \"slug\": \"圆形\"\n },\n {\n \"depth\": 2,\n \"title\": \"比例尺\",\n \"slug\": \"比例尺\"\n },\n {\n \"depth\": 3,\n \"title\": \"创建线性比例\",\n \"slug\": \"创建线性比例\"\n },\n {\n \"depth\": 4,\n \"title\": \"线性缩放\",\n \"slug\": \"线性缩放\"\n },\n {\n \"depth\": 4,\n \"title\": \"按比例设置域和范围\",\n \"slug\": \"按比例设置域和范围\"\n },\n {\n \"depth\": 4,\n \"title\": \"最小值最大值\",\n \"slug\": \"最小值最大值\"\n },\n {\n \"depth\": 3,\n \"title\": \"使用动态比例\",\n \"slug\": \"使用动态比例\"\n },\n {\n \"depth\": 3,\n \"title\": \"使用预定义的比例放置元素\",\n \"slug\": \"使用预定义的比例放置元素\"\n },\n {\n \"depth\": 3,\n \"title\": \"添加坐标轴\",\n \"slug\": \"添加坐标轴\"\n },\n {\n \"depth\": 2,\n \"title\": \"常见图表\",\n \"slug\": \"常见图表\"\n },\n {\n \"depth\": 3,\n \"title\": \"散点图\",\n \"slug\": \"散点图\"\n }\n ],\n \"updated\": \"2022-08-01T03:03:33.463Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"css和js两种方式实现div右移1000px动画\",\n \"created\": \"2022-07-20T00:00:00.000Z\",\n \"summary\": \"用keyframes和timer\",\n \"tags\": [\n \"CSS\",\n \"JavaScript\",\n \"animation\"\n ],\n \"slug\": \"/2022-07-20-animation/index.svelte.md\",\n \"path\": \"/2022-07-20-animation\",\n \"toc\": [],\n \"updated\": \"2022-08-01T03:03:33.463Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"我在看什么 · 5月\",\n \"created\": \"2022-07-16T00:00:00.000Z\",\n \"summary\": \"Anki / JSDoc / 蘑菇 / Music-Map ……\",\n \"tags\": [\n \"我在看什么\"\n ],\n \"image\": \"/2022-07-16-reading-5/May1.jpg\",\n \"slug\": \"/2022-07-16-reading-5/index.md\",\n \"path\": \"/2022-07-16-reading-5\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"Productivity\",\n \"slug\": \"productivity\"\n },\n {\n \"depth\": 2,\n \"title\": \"有趣的\",\n \"slug\": \"有趣的\"\n }\n ],\n \"updated\": \"2022-08-11T16:29:56.272Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"我在看什么 · 6月\",\n \"created\": \"2022-07-15T00:00:00.000Z\",\n \"summary\": \"Vue / 网页性能优化 / npm ……\",\n \"tags\": [\n \"我在看什么\"\n ],\n \"image\": \"/2022-07-15-reading-6/june.png\",\n \"slug\": \"/2022-07-15-reading-6/index.md\",\n \"path\": \"/2022-07-15-reading-6\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"编程相关\",\n \"slug\": \"编程相关\"\n },\n {\n \"depth\": 3,\n \"title\": \"前端\",\n \"slug\": \"前端\"\n },\n {\n \"depth\": 3,\n \"title\": \"后端\",\n \"slug\": \"后端\"\n },\n {\n \"depth\": 2,\n \"title\": \"其他\",\n \"slug\": \"其他\"\n },\n {\n \"depth\": 2,\n \"title\": \"互联网哲学\",\n \"slug\": \"互联网哲学\"\n }\n ],\n \"updated\": \"2022-08-06T11:32:41.091Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"SQL 基础笔记\",\n \"created\": \"2022-07-13T00:00:00.000Z\",\n \"summary\": \"关于增改删查的方式\",\n \"tags\": [\n \"SQL\"\n ],\n \"slug\": \"/2022-07-13-sql.md\",\n \"path\": \"/2022-07-13-sql\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"SQL vs. NOSQL\",\n \"slug\": \"sql-vs-nosql\"\n },\n {\n \"depth\": 2,\n \"title\": \"CRUD\",\n \"slug\": \"crud\"\n },\n {\n \"depth\": 3,\n \"title\": \"Create\",\n \"slug\": \"create\"\n },\n {\n \"depth\": 3,\n \"title\": \"Read\",\n \"slug\": \"read\"\n },\n {\n \"depth\": 3,\n \"title\": \"Update\",\n \"slug\": \"update\"\n },\n {\n \"depth\": 3,\n \"title\": \"Destory\",\n \"slug\": \"destory\"\n },\n {\n \"depth\": 2,\n \"title\": \"Understanding SQL Relationships, Foreign Keys and Inner Joins\",\n \"slug\": \"understanding-sql-relationships-foreign-keys-and-inner-joins\"\n },\n {\n \"depth\": 3,\n \"title\": \"FOREIGN KEY\",\n \"slug\": \"foreign-key\"\n },\n {\n \"depth\": 3,\n \"title\": \"INNER JOIN\",\n \"slug\": \"inner-join\"\n }\n ],\n \"updated\": \"2022-08-01T03:03:33.359Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"一些设计作品\",\n \"created\": \"2022-07-13T00:00:00.000Z\",\n \"summary\": \"logo / UI / 包装 / 儿童玩具 ……\",\n \"slug\": \"/2022-07-13-work/index.md\",\n \"path\": \"/2022-07-13-work\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"二十四节气茶包\",\n \"slug\": \"二十四节气茶包\"\n },\n {\n \"depth\": 2,\n \"title\": \"UI 设计\",\n \"slug\": \"ui-设计\"\n },\n {\n \"depth\": 2,\n \"title\": \"饼干包装\",\n \"slug\": \"饼干包装\"\n },\n {\n \"depth\": 2,\n \"title\": \"Logo\",\n \"slug\": \"logo\"\n },\n {\n \"depth\": 2,\n \"title\": \"排版装帧\",\n \"slug\": \"排版装帧\"\n },\n {\n \"depth\": 2,\n \"title\": \"儿童玩具\",\n \"slug\": \"儿童玩具\"\n }\n ],\n \"updated\": \"2022-08-01T03:03:33.433Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"Privacy Policy 隐私声明\",\n \"created\": \"2022-06-19T00:00:00.000Z\",\n \"flags\": [\n \"unlisted\"\n ],\n \"slug\": \"/privacy/index.svelte.md\",\n \"path\": \"/privacy\",\n \"toc\": [],\n \"updated\": \"2022-08-01T03:03:33.476Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"VPS · Jellyfin结合Cloudreve开启线上影院\",\n \"created\": \"2022-06-15T00:00:00.000Z\",\n \"summary\": \"基于 Docker 和 Nginx 的信心搭建过程\",\n \"image\": \"/2022-06-15-jellyfin/1.jpg\",\n \"tags\": [\n \"Nginx\",\n \"VPS\",\n \"Docker\"\n ],\n \"slug\": \"/2022-06-15-jellyfin/index.md\",\n \"path\": \"/2022-06-15-jellyfin\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"关于 Jellyfin\",\n \"slug\": \"关于-jellyfin\"\n },\n {\n \"depth\": 2,\n \"title\": \"Cloudrever\",\n \"slug\": \"cloudrever\"\n },\n {\n \"depth\": 3,\n \"title\": \"反代\",\n \"slug\": \"反代\"\n },\n {\n \"depth\": 3,\n \"title\": \"一些配置\",\n \"slug\": \"一些配置\"\n },\n {\n \"depth\": 2,\n \"title\": \"Jellyfin\",\n \"slug\": \"jellyfin\"\n },\n {\n \"depth\": 3,\n \"title\": \"搭建\",\n \"slug\": \"搭建\"\n },\n {\n \"depth\": 3,\n \"title\": \"反代\",\n \"slug\": \"反代-1\"\n },\n {\n \"depth\": 3,\n \"title\": \"媒体库路径\",\n \"slug\": \"媒体库路径\"\n },\n {\n \"depth\": 3,\n \"title\": \"插件安装\",\n \"slug\": \"插件安装\"\n },\n {\n \"depth\": 3,\n \"title\": \"主题和语言\",\n \"slug\": \"主题和语言\"\n }\n ],\n \"updated\": \"2022-08-06T11:32:41.091Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"VPS · 配置 Cloudflare 的免费 SSL 证书\",\n \"created\": \"2022-06-12T00:00:00.000Z\",\n \"summary\": \"关于如何为多个域名配置SSL证书的操作笔记\",\n \"tags\": [\n \"Nginx\",\n \"VPS\"\n ],\n \"slug\": \"/2022-06-12-cloudflare.md\",\n \"path\": \"/2022-06-12-cloudflare\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"1. 创建证书\",\n \"slug\": \"1-创建证书\"\n },\n {\n \"depth\": 2,\n \"title\": \"2. 密钥上传到 VPS\",\n \"slug\": \"2-密钥上传到-vps\"\n },\n {\n \"depth\": 2,\n \"title\": \"3. 修改 Nginx 配置\",\n \"slug\": \"3-修改-nginx-配置\"\n }\n ],\n \"updated\": \"2022-08-01T03:03:33.353Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"实现一个返回页面顶部的 Vue3 组件\",\n \"created\": \"2022-06-10T00:00:00.000Z\",\n \"summary\": \"结合流畅的动画平滑滚动到页面顶部\",\n \"tags\": [\n \"Vue3\",\n \"BootStrap\"\n ],\n \"slug\": \"/2022-06-10-backtotop.md\",\n \"path\": \"/2022-06-10-backtotop\",\n \"toc\": [],\n \"updated\": \"2022-08-01T11:38:16.754Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"Contabo OSS + PicGo 图床配置\",\n \"created\": \"2022-05-30T00:00:00.000Z\",\n \"summary\": \"OSS自建图床笔记\",\n \"tags\": [\n \"OSS\"\n ],\n \"slug\": \"/2022-05-30-contabo-oss.md\",\n \"path\": \"/2022-05-30-contabo-oss\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"1. 购买套餐\",\n \"slug\": \"1-购买套餐\"\n },\n {\n \"depth\": 2,\n \"title\": \"2. 创建 Bucket\",\n \"slug\": \"2-创建-bucket\"\n },\n {\n \"depth\": 2,\n \"title\": \"3. 安装 PicGo 插件\",\n \"slug\": \"3-安装-picgo-插件\"\n },\n {\n \"depth\": 2,\n \"title\": \"4. 配置插件\",\n \"slug\": \"4-配置插件\"\n },\n {\n \"depth\": 3,\n \"title\": \"应用密钥 ID 和 应用密钥\",\n \"slug\": \"应用密钥-id-和-应用密钥\"\n },\n {\n \"depth\": 3,\n \"title\": \"桶 / 自定义节点 /自定义域名\",\n \"slug\": \"桶--自定义节点-自定义域名\"\n },\n {\n \"depth\": 3,\n \"title\": \"其他设置\",\n \"slug\": \"其他设置\"\n },\n {\n \"depth\": 2,\n \"title\": \"5. 其他\",\n \"slug\": \"5-其他\"\n },\n {\n \"depth\": 3,\n \"title\": \"Obsidian 中的图床设置\",\n \"slug\": \"obsidian-中的图床设置\"\n },\n {\n \"depth\": 3,\n \"title\": \"更多 PicGO 插件：\",\n \"slug\": \"更多-picgo-插件\"\n }\n ],\n \"updated\": \"2022-08-01T03:03:33.353Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"为博客写一个Project showcase 页面\",\n \"created\": \"2022-05-26T00:00:00.000Z\",\n \"summary\": \"第一次Pull Request的经历\",\n \"tags\": [\n \"Svelte\",\n \"Open Source\"\n ],\n \"slug\": \"/2022-05-26-write-a-page-template.md\",\n \"path\": \"/2022-05-26-write-a-page-template\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"1. 分析需求\",\n \"slug\": \"1-分析需求\"\n },\n {\n \"depth\": 2,\n \"title\": \"2. 画原型图\",\n \"slug\": \"2-画原型图\"\n },\n {\n \"depth\": 2,\n \"title\": \"2. 创建组件样式 CSS\",\n \"slug\": \"2-创建组件样式-css\"\n },\n {\n \"depth\": 2,\n \"title\": \"4. 编写组件代码\",\n \"slug\": \"4-编写组件代码\"\n },\n {\n \"depth\": 3,\n \"title\": \"数据\",\n \"slug\": \"数据\"\n },\n {\n \"depth\": 3,\n \"title\": \"组件\",\n \"slug\": \"组件\"\n },\n {\n \"depth\": 3,\n \"title\": \"页面\",\n \"slug\": \"页面\"\n },\n {\n \"depth\": 3,\n \"title\": \"响应式布局\",\n \"slug\": \"响应式布局\"\n },\n {\n \"depth\": 2,\n \"title\": \"5. 测试\",\n \"slug\": \"5-测试\"\n },\n {\n \"depth\": 2,\n \"title\": \"6. Pull request 到 Github\",\n \"slug\": \"6-pull-request-到-github\"\n },\n {\n \"depth\": 2,\n \"title\": \"7. Last but not least\",\n \"slug\": \"7-last-but-not-least\"\n }\n ],\n \"updated\": \"2022-08-01T11:36:42.589Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"Git · 常用操作笔记\",\n \"created\": \"2022-05-25T00:00:00.000Z\",\n \"summary\": \"每次更新博客进行的操作以及常见错误处理\",\n \"tags\": [\n \"Git\"\n ],\n \"slug\": \"/2022-05-25-git.md\",\n \"path\": \"/2022-05-25-git\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"每次更新博客进行的操作\",\n \"slug\": \"每次更新博客进行的操作\"\n },\n {\n \"depth\": 3,\n \"title\": \"1. 追踪所有文件\",\n \"slug\": \"1-追踪所有文件\"\n },\n {\n \"depth\": 3,\n \"title\": \"2. 提交上传信息\",\n \"slug\": \"2-提交上传信息\"\n },\n {\n \"depth\": 3,\n \"title\": \"3. push 到 Github\",\n \"slug\": \"3-push-到-github\"\n },\n {\n \"depth\": 2,\n \"title\": \"常用 Git 操作\",\n \"slug\": \"常用-git-操作\"\n },\n {\n \"depth\": 2,\n \"title\": \"常见问题\",\n \"slug\": \"常见问题\"\n },\n {\n \"depth\": 3,\n \"title\": \"版本回滚\",\n \"slug\": \"版本回滚\"\n },\n {\n \"depth\": 3,\n \"title\": \"报错处理\",\n \"slug\": \"报错处理\"\n },\n {\n \"depth\": 3,\n \"title\": \"博客相关\",\n \"slug\": \"博客相关\"\n },\n {\n \"depth\": 3,\n \"title\": \"其他\",\n \"slug\": \"其他\"\n }\n ],\n \"updated\": \"2022-08-01T03:03:33.322Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"Hypothesis 使用小记\",\n \"created\": \"2022-05-25T00:00:00.000Z\",\n \"summary\": \"Hypothesis同步到Obsidian / Logseq的方法\",\n \"tags\": [\n \"Logseq\",\n \"Obsidian\"\n ],\n \"slug\": \"/2022-05-25-hypothesis/index.md\",\n \"path\": \"/2022-05-25-hypothesis\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"同步到 Logseq\",\n \"slug\": \"同步到-logseq\"\n },\n {\n \"depth\": 3,\n \"title\": \"1. 打开插件系统开关\",\n \"slug\": \"1-打开插件系统开关\"\n },\n {\n \"depth\": 3,\n \"title\": \"2. 安装 Hypothesis 插件\",\n \"slug\": \"2-安装-hypothesis-插件\"\n },\n {\n \"depth\": 3,\n \"title\": \"3. 获取 API Token\",\n \"slug\": \"3-获取-api-token\"\n },\n {\n \"depth\": 3,\n \"title\": \"4. 同步笔记\",\n \"slug\": \"4-同步笔记\"\n },\n {\n \"depth\": 3,\n \"title\": \"5. 修改笔记模板\",\n \"slug\": \"5-修改笔记模板\"\n },\n {\n \"depth\": 2,\n \"title\": \"同步到 Obsidian\",\n \"slug\": \"同步到-obsidian\"\n },\n {\n \"depth\": 3,\n \"title\": \"1. 安装 Hypothesis 插件\",\n \"slug\": \"1-安装-hypothesis-插件\"\n },\n {\n \"depth\": 3,\n \"title\": \"2. API 配置\",\n \"slug\": \"2-api-配置\"\n },\n {\n \"depth\": 3,\n \"title\": \"3. 笔记模板配置\",\n \"slug\": \"3-笔记模板配置\"\n },\n {\n \"depth\": 3,\n \"title\": \"4. 更新笔记\",\n \"slug\": \"4-更新笔记\"\n },\n {\n \"depth\": 2,\n \"title\": \"订阅 Hypothesis 的 RSS\",\n \"slug\": \"订阅-hypothesis-的-rss\"\n },\n {\n \"depth\": 2,\n \"title\": \"其他参考\",\n \"slug\": \"其他参考\"\n }\n ],\n \"updated\": \"2022-08-01T03:03:33.353Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"SQL · 在 Windows 10 上安装 sqlite\",\n \"created\": \"2022-05-23T00:00:00.000Z\",\n \"summary\": \"写给计算机小白的 sqlite 安装笔记\",\n \"tags\": [\n \"SQL\"\n ],\n \"slug\": \"/2022-05-23-win-sql/index.md\",\n \"path\": \"/2022-05-23-win-sql\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"1. 下载二进制文件\",\n \"slug\": \"1-下载二进制文件\"\n },\n {\n \"depth\": 2,\n \"title\": \"2. 创建安装文件夹\",\n \"slug\": \"2-创建安装文件夹\"\n },\n {\n \"depth\": 2,\n \"title\": \"3. 添加环境变量\",\n \"slug\": \"3-添加环境变量\"\n },\n {\n \"depth\": 2,\n \"title\": \"4. 命令提示符中查看 sqlite3 版本\",\n \"slug\": \"4-命令提示符中查看-sqlite3-版本\"\n },\n {\n \"depth\": 2,\n \"title\": \"常用命令行\",\n \"slug\": \"常用命令行\"\n }\n ],\n \"updated\": \"2022-08-01T03:03:33.303Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"JavaScript · 数组中的copyWithin方法\",\n \"created\": \"2022-05-08T17:13:47.671Z\",\n \"summary\": \"一种数组内元素复制的方法\",\n \"tags\": [\n \"JavaScript\"\n ],\n \"lastmod\": \"2022-05-09T02:27:47.533Z\",\n \"slug\": \"/2022-05-09-copywithin/index.md\",\n \"path\": \"/2022-05-09-copywithin\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"简介\",\n \"slug\": \"简介\"\n },\n {\n \"depth\": 3,\n \"title\": \"语法：\",\n \"slug\": \"语法\"\n },\n {\n \"depth\": 2,\n \"title\": \"参数\",\n \"slug\": \"参数\"\n },\n {\n \"depth\": 3,\n \"title\": \"target\",\n \"slug\": \"target\"\n },\n {\n \"depth\": 3,\n \"title\": \"start\",\n \"slug\": \"start\"\n },\n {\n \"depth\": 3,\n \"title\": \"end\",\n \"slug\": \"end\"\n },\n {\n \"depth\": 2,\n \"title\": \"例子\",\n \"slug\": \"例子\"\n },\n {\n \"depth\": 3,\n \"title\": \"源码\",\n \"slug\": \"源码\"\n },\n {\n \"depth\": 3,\n \"title\": \"可视化\",\n \"slug\": \"可视化\"\n }\n ],\n \"updated\": \"2022-08-01T03:03:33.294Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"VPS 安全初始化\",\n \"created\": \"2022-05-06T00:00:00.000Z\",\n \"summary\": \"上次 VPS 被别人暴力破解了，一哭二闹三重装之后，有了本文\",\n \"tags\": [\n \"VPS\",\n \"Self hosted\"\n ],\n \"slug\": \"/2022-05-07-vps-init.md\",\n \"path\": \"/2022-05-07-vps-init\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"思路\",\n \"slug\": \"思路\"\n },\n {\n \"depth\": 3,\n \"title\": \"日常防护\",\n \"slug\": \"日常防护\"\n },\n {\n \"depth\": 3,\n \"title\": \"安全检查\",\n \"slug\": \"安全检查\"\n },\n {\n \"depth\": 2,\n \"title\": \"1. 创建新用户\",\n \"slug\": \"1-创建新用户\"\n },\n {\n \"depth\": 2,\n \"title\": \"2. 配置 SSH-keys\",\n \"slug\": \"2-配置-ssh-keys\"\n },\n {\n \"depth\": 3,\n \"title\": \"本地生成 SSH 密钥对\",\n \"slug\": \"本地生成-ssh-密钥对\"\n },\n {\n \"depth\": 3,\n \"title\": \"安装公钥\",\n \"slug\": \"安装公钥\"\n },\n {\n \"depth\": 3,\n \"title\": \"修改权限\",\n \"slug\": \"修改权限\"\n },\n {\n \"depth\": 3,\n \"title\": \"修改 sshd 配置文件\",\n \"slug\": \"修改-sshd-配置文件\"\n },\n {\n \"depth\": 3,\n \"title\": \"禁用密码登陆和改端口\",\n \"slug\": \"禁用密码登陆和改端口\"\n },\n {\n \"depth\": 3,\n \"title\": \"修改默认登陆端口\",\n \"slug\": \"修改默认登陆端口\"\n },\n {\n \"depth\": 2,\n \"title\": \"3. 安装 ClamAV\",\n \"slug\": \"3-安装-clamav\"\n },\n {\n \"depth\": 3,\n \"title\": \"安装\",\n \"slug\": \"安装\"\n },\n {\n \"depth\": 3,\n \"title\": \"更新病毒数据库\",\n \"slug\": \"更新病毒数据库\"\n },\n {\n \"depth\": 3,\n \"title\": \"开机启动\",\n \"slug\": \"开机启动\"\n },\n {\n \"depth\": 3,\n \"title\": \"下载 ClamAV 数据库\",\n \"slug\": \"下载-clamav-数据库\"\n },\n {\n \"depth\": 3,\n \"title\": \"限制 Clamscan CPU 使用率\",\n \"slug\": \"限制-clamscan-cpu-使用率\"\n },\n {\n \"depth\": 3,\n \"title\": \"常见 CLI\",\n \"slug\": \"常见-cli\"\n },\n {\n \"depth\": 3,\n \"title\": \"ClamAV 返回码\",\n \"slug\": \"clamav-返回码\"\n },\n {\n \"depth\": 2,\n \"title\": \"4. 安装 Fail2ban\",\n \"slug\": \"4-安装-fail2ban\"\n },\n {\n \"depth\": 3,\n \"title\": \"准备\",\n \"slug\": \"准备\"\n },\n {\n \"depth\": 3,\n \"title\": \"安装\",\n \"slug\": \"安装-1\"\n },\n {\n \"depth\": 3,\n \"title\": \"修改配置：\",\n \"slug\": \"修改配置\"\n },\n {\n \"depth\": 2,\n \"title\": \"5. SSL 证书相关\",\n \"slug\": \"5-ssl-证书相关\"\n }\n ],\n \"updated\": \"2022-08-01T03:03:33.291Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"About\",\n \"created\": \"2022-05-06T00:00:00.000Z\",\n \"updated\": \"2022-05-06T00:00:00.000Z\",\n \"flags\": [\n \"unlisted\"\n ],\n \"lastmod\": \"2022-05-20T04:07:08.760Z\",\n \"slug\": \"/about/index.svelte.md\",\n \"path\": \"/about\",\n \"toc\": [\n {\n \"depth\": 3,\n \"title\": \"写码进度\",\n \"slug\": \"写码进度\"\n },\n {\n \"depth\": 3,\n \"title\": \"其他站点\",\n \"slug\": \"其他站点\"\n },\n {\n \"depth\": 3,\n \"title\": \"博客日志\",\n \"slug\": \"博客日志\"\n }\n ],\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"CSS · 解决 Chrome 中小于12px的字体不显示的问题\",\n \"lastmod\": \"2022-04-07T07:36:23.629Z\",\n \"summary\": \"先用scale总体缩小再补上减少的宽度\",\n \"created\": \"2022-03-29T13:46:29.228Z\",\n \"tags\": [\n \"CSS\",\n \"CSS Trick\"\n ],\n \"categories\": [\n \"CSS\"\n ],\n \"toc\": false,\n \"slug\": \"/2022-03-29-12px.md\",\n \"path\": \"/2022-03-29-12px\",\n \"updated\": \"2022-08-06T10:50:25.374Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"Miniflux · 保存文章到 Pocket 以及 RSS\",\n \"summary\": \"将 Miniflux 上的文章到保存到 Pocket/Instapaper,以及 RSS 相关文章和资源\",\n \"created\": \"2022-03-10T16:24:38.663Z\",\n \"preview\": \"\",\n \"draft\": \"\",\n \"tags\": [\n \"RSS\",\n \"Miniflux\"\n ],\n \"changelogs\": [\n {\n \"tag\": \"202203011\",\n \"summary\": [\n \"添加了`instapaper`的连接方式\",\n \"添加了Pocket按钮嵌入方式\"\n ]\n }\n ],\n \"lastmod\": \"2022-04-07T07:38:52.406Z\",\n \"slug\": \"/2022-03-11-miniflux-to-pocket.md\",\n \"path\": \"/2022-03-11-miniflux-to-pocket\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"1. 创建 Pocket Application\",\n \"slug\": \"1-创建-pocket-application\"\n },\n {\n \"depth\": 2,\n \"title\": \"2. 获取 Consumer Key 用户密钥\",\n \"slug\": \"2-获取-consumer-key-用户密钥\"\n },\n {\n \"depth\": 2,\n \"title\": \"3. 获取 Access Token 访问密钥\",\n \"slug\": \"3-获取-access-token-访问密钥\"\n },\n {\n \"depth\": 2,\n \"title\": \"其他\",\n \"slug\": \"其他\"\n },\n {\n \"depth\": 3,\n \"title\": \"1.为博客添加 Pocket 收藏按钮\",\n \"slug\": \"1为博客添加-pocket-收藏按钮\"\n },\n {\n \"depth\": 3,\n \"title\": \"2.用 Fever 同步到 Reeder\",\n \"slug\": \"2用-fever-同步到-reeder\"\n },\n {\n \"depth\": 3,\n \"title\": \"3.连接到 Instapaper\",\n \"slug\": \"3连接到-instapaper\"\n },\n {\n \"depth\": 2,\n \"title\": \"RSS 相关内容\",\n \"slug\": \"rss-相关内容\"\n },\n {\n \"depth\": 3,\n \"title\": \"1. Miniflux 搭建\",\n \"slug\": \"1-miniflux-搭建\"\n },\n {\n \"depth\": 3,\n \"title\": \"2. 其他选择\",\n \"slug\": \"2-其他选择\"\n },\n {\n \"depth\": 3,\n \"title\": \"3. RSS 生成\",\n \"slug\": \"3-rss-生成\"\n },\n {\n \"depth\": 3,\n \"title\": \"4. 看什么\",\n \"slug\": \"4-看什么\"\n },\n {\n \"depth\": 4,\n \"title\": \"5. 关于 RSS\",\n \"slug\": \"5-关于-rss\"\n }\n ],\n \"updated\": \"2022-08-06T10:51:23.859Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"Forty页面仿写\",\n \"summary\": \"完成 HTML、CSS 代码编写，暂无 JavaScript\",\n \"created\": \"2022-03-10T08:38:17.227Z\",\n \"preview\": \"\",\n \"draft\": \"\",\n \"tags\": [\n \"CSS\",\n \"HTML\"\n ],\n \"lastmod\": \"2022-04-07T07:39:48.473Z\",\n \"slug\": \"/2022-03-10-forty.md\",\n \"path\": \"/2022-03-10-forty\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"题目\",\n \"slug\": \"题目\"\n },\n {\n \"depth\": 2,\n \"title\": \"示例图\",\n \"slug\": \"示例图\"\n },\n {\n \"depth\": 2,\n \"title\": \"Demo\",\n \"slug\": \"demo\"\n }\n ],\n \"updated\": \"2022-08-06T10:51:23.374Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"CSS · Tab选项卡\",\n \"summary\": \"一个纯 CSS 实现的 Tab 选项卡\",\n \"created\": \"2022-03-09T07:42:25.299Z\",\n \"tags\": [\n \"CSS\"\n ],\n \"categories\": [\n \"CSS\"\n ],\n \"lastmod\": \"2022-04-07T07:40:02.371Z\",\n \"slug\": \"/2022-03-09-css-tab.md\",\n \"path\": \"/2022-03-09-css-tab\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"原理\",\n \"slug\": \"原理\"\n },\n {\n \"depth\": 2,\n \"title\": \"代码\",\n \"slug\": \"代码\"\n },\n {\n \"depth\": 3,\n \"title\": \"HTML\",\n \"slug\": \"html\"\n },\n {\n \"depth\": 3,\n \"title\": \"CSS\",\n \"slug\": \"css\"\n },\n {\n \"depth\": 2,\n \"title\": \"参考\",\n \"slug\": \"参考\"\n }\n ],\n \"updated\": \"2022-08-06T10:50:54.161Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"JavaScript · 打字机效果生成器\",\n \"summary\": \"用 JavaScript 实现网页打字机效果\",\n \"created\": \"2022-03-08T16:19:05.137Z\",\n \"tags\": [\n \"JavaScript\"\n ],\n \"categories\": [\n \"JavaScript\"\n ],\n \"lastmod\": \"2022-04-07T07:40:27.758Z\",\n \"slug\": \"/2022-03-09-typewriter.md\",\n \"path\": \"/2022-03-09-typewriter\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"题目\",\n \"slug\": \"题目\"\n },\n {\n \"depth\": 2,\n \"title\": \"解法\",\n \"slug\": \"解法\"\n },\n {\n \"depth\": 2,\n \"title\": \"参考\",\n \"slug\": \"参考\"\n }\n ],\n \"updated\": \"2022-08-06T10:50:29.470Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"JavaScript · Caesar Cipher 凯撒加密\",\n \"summary\": \"用JavaScrpit编码实现凯撒加密算法\",\n \"created\": \"2022-03-08T16:01:08.850Z\",\n \"tags\": [\n \"JavaScript\"\n ],\n \"categories\": [\n \"JavaScript\"\n ],\n \"lastmod\": \"2022-04-07T07:20:47.694Z\",\n \"slug\": \"/2022-03-09-caesar-cipher.md\",\n \"path\": \"/2022-03-09-caesar-cipher\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"题目\",\n \"slug\": \"题目\"\n },\n {\n \"depth\": 2,\n \"title\": \"解法\",\n \"slug\": \"解法\"\n },\n {\n \"depth\": 3,\n \"title\": \"HTML\",\n \"slug\": \"html\"\n },\n {\n \"depth\": 3,\n \"title\": \"JS\",\n \"slug\": \"js\"\n },\n {\n \"depth\": 2,\n \"title\": \"参考\",\n \"slug\": \"参考\"\n }\n ],\n \"updated\": \"2022-08-06T10:50:48.659Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"JavaScript · 字符串去重\",\n \"summary\": \"编码实现字符串去重\",\n \"created\": \"2022-03-07T13:55:21.090Z\",\n \"tags\": [\n \"JavaScript\"\n ],\n \"categories\": [\n \"JavaScript\"\n ],\n \"lastmod\": \"2022-04-07T07:20:30.550Z\",\n \"slug\": \"/2022-03-07-filter.md\",\n \"path\": \"/2022-03-07-filter\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"题目\",\n \"slug\": \"题目\"\n },\n {\n \"depth\": 2,\n \"title\": \"解法\",\n \"slug\": \"解法\"\n },\n {\n \"depth\": 2,\n \"title\": \"其他解法\",\n \"slug\": \"其他解法\"\n }\n ],\n \"updated\": \"2022-08-06T10:50:50.151Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"Obsidian · 网课学习笔记整理\",\n \"summary\": \"拆分整合的过程\",\n \"created\": \"2022-03-06T16:23:33.118Z\",\n \"tags\": [\n \"Obsidian\"\n ],\n \"categories\": [\n \"Obsidian\"\n ],\n \"lastmod\": \"2022-04-07T07:20:39.933Z\",\n \"slug\": \"/2022-03-07-obsidian-notes1.md\",\n \"path\": \"/2022-03-07-obsidian-notes1\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"具体的方法\",\n \"slug\": \"具体的方法\"\n },\n {\n \"depth\": 3,\n \"title\": \"Step1-构建地图\",\n \"slug\": \"step1-构建地图\"\n },\n {\n \"depth\": 3,\n \"title\": \"Step2-写课堂笔记\",\n \"slug\": \"step2-写课堂笔记\"\n },\n {\n \"depth\": 3,\n \"title\": \"Step3-重组笔记\",\n \"slug\": \"step3-重组笔记\"\n },\n {\n \"depth\": 4,\n \"title\": \"布局\",\n \"slug\": \"布局\"\n },\n {\n \"depth\": 4,\n \"title\": \"结构编辑\",\n \"slug\": \"结构编辑\"\n },\n {\n \"depth\": 4,\n \"title\": \"拆分笔记\",\n \"slug\": \"拆分笔记\"\n }\n ],\n \"updated\": \"2022-08-06T10:50:46.655Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"Airtable · 网页剪藏\",\n \"summary\": \"Airtable Web Cilpper设置\",\n \"created\": \"2022-03-06T05:58:29.026Z\",\n \"categories\": [\n \"实用技巧\"\n ],\n \"tags\": [\n \"实用技巧\"\n ],\n \"lastmod\": \"2022-04-16T12:54:20.049Z\",\n \"slug\": \"/2022-03-06-airtable.md\",\n \"path\": \"/2022-03-06-airtable\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"书签这回事\",\n \"slug\": \"书签这回事\"\n },\n {\n \"depth\": 2,\n \"title\": \"关于 Airtable\",\n \"slug\": \"关于-airtable\"\n },\n {\n \"depth\": 2,\n \"title\": \"怎么用 Airtable 剪切网页\",\n \"slug\": \"怎么用-airtable-剪切网页\"\n },\n {\n \"depth\": 3,\n \"title\": \"1. 创建表格\",\n \"slug\": \"1-创建表格\"\n },\n {\n \"depth\": 3,\n \"title\": \"2. 创建 app\",\n \"slug\": \"2-创建-app\"\n },\n {\n \"depth\": 3,\n \"title\": \"3. 配置剪切设置\",\n \"slug\": \"3-配置剪切设置\"\n },\n {\n \"depth\": 3,\n \"title\": \"4. Web Clipper 剪切\",\n \"slug\": \"4-web-clipper-剪切\"\n }\n ],\n \"updated\": \"2022-08-06T10:50:42.370Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"JavaScript · 十进制数转二进制\",\n \"summary\": \"用JavaScript将十进制数转二进制数\",\n \"created\": \"2022-03-04T14:57:48.683Z\",\n \"draft\": \"\",\n \"tags\": [\n \"JavaScript\"\n ],\n \"categories\": [\n \"JavaScript\"\n ],\n \"lastmod\": \"2022-04-16T12:54:16.167Z\",\n \"type\": \"article\",\n \"slug\": \"/2022-03-04-decbin.md\",\n \"path\": \"/2022-03-04-decbin\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"题目\",\n \"slug\": \"题目\"\n },\n {\n \"depth\": 3,\n \"title\": \"Task1\",\n \"slug\": \"task1\"\n },\n {\n \"depth\": 3,\n \"title\": \"Task2\",\n \"slug\": \"task2\"\n },\n {\n \"depth\": 2,\n \"title\": \"解法\",\n \"slug\": \"解法\"\n }\n ],\n \"updated\": \"2022-08-06T10:50:40.572Z\",\n \"html\": \"\"\n },\n {\n \"title\": \"JavaScript · 判断水仙花数\",\n \"summary\": \"用JavaScript判断水仙花数\",\n \"created\": \"2022-03-03T15:07:14.533Z\",\n \"categories\": [\n \"JavaScript\"\n ],\n \"tags\": [\n \"JavaScript\"\n ],\n \"slug\": \"/2022-03-03.md\",\n \"lastmod\": \"2022-04-07T07:20:02.340Z\",\n \"path\": \"/2022-03-03\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"题目\",\n \"slug\": \"题目\"\n },\n {\n \"depth\": 2,\n \"title\": \"解法\",\n \"slug\": \"解法\"\n },\n {\n \"depth\": 2,\n \"title\": \"参考\",\n \"slug\": \"参考\"\n }\n ],\n \"updated\": \"2022-08-06T10:50:38.994Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"自建网页书签Flare\",\n \"created\": \"2022-02-20T14:04:17.000Z\",\n \"tags\": [\n \"Docker\",\n \"Self-hosted\"\n ],\n \"slug\": \"/flare.md\",\n \"summary\": \"通过Docker自建网页书签Flare\",\n \"lastmod\": \"2022-03-30T02:19:33.711Z\",\n \"path\": \"/flare\",\n \"toc\": [\n {\n \"depth\": 3,\n \"title\": \"1.创建 Flare 文件夹\",\n \"slug\": \"1创建-flare-文件夹\"\n },\n {\n \"depth\": 3,\n \"title\": \"2.下载包含示例的代码\",\n \"slug\": \"2下载包含示例的代码\"\n },\n {\n \"depth\": 3,\n \"title\": \"3.运行容器\",\n \"slug\": \"3运行容器\"\n },\n {\n \"depth\": 4,\n \"title\": \"方法 1：直接启动\",\n \"slug\": \"方法-1直接启动\"\n },\n {\n \"depth\": 4,\n \"title\": \"方法 2：通过 docker composer\",\n \"slug\": \"方法-2通过-docker-composer\"\n },\n {\n \"depth\": 3,\n \"title\": \"4.修改书签内容\",\n \"slug\": \"4修改书签内容\"\n },\n {\n \"depth\": 3,\n \"title\": \"5.用 nginx 反代和设置域名\",\n \"slug\": \"5用-nginx-反代和设置域名\"\n },\n {\n \"depth\": 3,\n \"title\": \"6.SSL 证书和其他书签\",\n \"slug\": \"6ssl-证书和其他书签\"\n }\n ],\n \"updated\": \"2022-08-06T10:49:53.655Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"用 docker 安装 Halo 博客\",\n \"created\": \"2022-02-16T14:04:17.000Z\",\n \"tags\": [\n \"Docker\",\n \"Self-hosted\"\n ],\n \"slug\": \"/halo.md\",\n \"summary\": \"\",\n \"lastmod\": \"2022-05-07T05:39:19.169Z\",\n \"path\": \"/halo\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"准备\",\n \"slug\": \"准备\"\n },\n {\n \"depth\": 3,\n \"title\": \"解析域名\",\n \"slug\": \"解析域名\"\n },\n {\n \"depth\": 3,\n \"title\": \"安装 docker\",\n \"slug\": \"安装-docker\"\n },\n {\n \"depth\": 3,\n \"title\": \"检查端口开放情况\",\n \"slug\": \"检查端口开放情况\"\n },\n {\n \"depth\": 2,\n \"title\": \"安装 Halo\",\n \"slug\": \"安装-halo\"\n },\n {\n \"depth\": 3,\n \"title\": \"1.创建工作目录\",\n \"slug\": \"1创建工作目录\"\n },\n {\n \"depth\": 3,\n \"title\": \"2.下载示例配置文件到工作目录\",\n \"slug\": \"2下载示例配置文件到工作目录\"\n },\n {\n \"depth\": 3,\n \"title\": \"3. 编辑配置文件，配置数据库或者端口\",\n \"slug\": \"3-编辑配置文件配置数据库或者端口\"\n },\n {\n \"depth\": 4,\n \"title\": \"打开配置文件 application.yaml\",\n \"slug\": \"打开配置文件-applicationyaml\"\n },\n {\n \"depth\": 4,\n \"title\": \"修改配置\",\n \"slug\": \"修改配置\"\n },\n {\n \"depth\": 3,\n \"title\": \"4. 拉取最新的 Halo 镜像\",\n \"slug\": \"4-拉取最新的-halo-镜像\"\n },\n {\n \"depth\": 3,\n \"title\": \"5. 创建容器\",\n \"slug\": \"5-创建容器\"\n },\n {\n \"depth\": 3,\n \"title\": \"6. 打开安装引导界面。\",\n \"slug\": \"6-打开安装引导界面\"\n },\n {\n \"depth\": 2,\n \"title\": \"用 Nginx 反代\",\n \"slug\": \"用-nginx-反代\"\n },\n {\n \"depth\": 3,\n \"title\": \"1.安装 Nginx\",\n \"slug\": \"1安装-nginx\"\n },\n {\n \"depth\": 3,\n \"title\": \"2.配置 halo.conf\",\n \"slug\": \"2配置-haloconf\"\n },\n {\n \"depth\": 3,\n \"title\": \"3.重启 nginx\",\n \"slug\": \"3重启-nginx\"\n },\n {\n \"depth\": 2,\n \"title\": \"安装 certbot，为域名获取免费 SSL 证书\",\n \"slug\": \"安装-certbot为域名获取免费-ssl-证书\"\n },\n {\n \"depth\": 3,\n \"title\": \"1.安装 certbot\",\n \"slug\": \"1安装-certbot\"\n },\n {\n \"depth\": 3,\n \"title\": \"2.配置证书\",\n \"slug\": \"2配置证书\"\n },\n {\n \"depth\": 2,\n \"title\": \"其他\",\n \"slug\": \"其他\"\n }\n ],\n \"updated\": \"2022-08-06T10:49:49.221Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"VS Code 技巧合集\",\n \"tags\": [\n \"实用技巧\"\n ],\n \"categories\": [\n \"实用技巧\"\n ],\n \"slug\": \"/vscode.md\",\n \"summary\": \"字体/插件/设置……\",\n \"created\": \"2022-01-27T13:40:28.920Z\",\n \"lastmod\": \"2022-03-30T02:20:34.584Z\",\n \"path\": \"/vscode\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"关闭 VS Code 中的 popup 面板\",\n \"slug\": \"关闭-vs-code-中的-popup-面板\"\n },\n {\n \"depth\": 2,\n \"title\": \"修改字体\",\n \"slug\": \"修改字体\"\n },\n {\n \"depth\": 2,\n \"title\": \"快捷键\",\n \"slug\": \"快捷键\"\n },\n {\n \"depth\": 2,\n \"title\": \"插件\",\n \"slug\": \"插件\"\n },\n {\n \"depth\": 2,\n \"title\": \"设置\",\n \"slug\": \"设置\"\n },\n {\n \"depth\": 2,\n \"title\": \"其他\",\n \"slug\": \"其他\"\n }\n ],\n \"updated\": \"2022-08-06T10:49:29.477Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"两种免费发布Axure原型的方式\",\n \"created\": \"2022-01-21T00:11:17.000Z\",\n \"tags\": [\n \"实用技巧\"\n ],\n \"slug\": \"/axure.md\",\n \"summary\": \"通过Netlify和Vercel发布\",\n \"lastmod\": \"2022-04-07T07:24:20.692Z\",\n \"path\": \"/axure\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"Netlify\",\n \"slug\": \"netlify\"\n },\n {\n \"depth\": 2,\n \"title\": \"Vercel +Github\",\n \"slug\": \"vercel-github\"\n }\n ],\n \"updated\": \"2022-08-06T10:51:25.527Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"CSS · Argon主题的CSS修改\",\n \"created\": \"2022-01-16T14:04:17.000Z\",\n \"tags\": [\n \"CSS\"\n ],\n \"slug\": \"/argon.md\",\n \"summary\": \"基于最近所学，对当前Argon主题做了一些微小的调整\",\n \"lastmod\": \"2022-05-07T05:30:35.639Z\",\n \"path\": \"/argon\",\n \"toc\": [],\n \"updated\": \"2022-08-06T10:50:02.849Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"CSS · hover时图片放大的动效\",\n \"created\": \"2022-01-13T16:03:47.000Z\",\n \"slug\": \"/hover.md\",\n \"tags\": [\n \"CSS Trick\",\n \"CSS\"\n ],\n \"summary\": \"通过transform设置\",\n \"lastmod\": \"2022-05-07T05:30:52.029Z\",\n \"path\": \"/hover\",\n \"toc\": [],\n \"updated\": \"2022-08-06T10:49:47.292Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"CSS · 三种布局方式\",\n \"slug\": \"/css-layout.md\",\n \"tags\": [\n \"CSS\"\n ],\n \"created\": \"2022-01-13T10:07:00.000Z\",\n \"summary\": \"Float / Flexbox / Grid /\",\n \"lastmod\": \"2022-05-07T05:30:20.613Z\",\n \"path\": \"/css-layout\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"Overview\",\n \"slug\": \"overview\"\n },\n {\n \"depth\": 2,\n \"title\": \"Box-sizing\",\n \"slug\": \"box-sizing\"\n },\n {\n \"depth\": 3,\n \"title\": \"reset\",\n \"slug\": \"reset\"\n },\n {\n \"depth\": 2,\n \"title\": \"Float Layout\",\n \"slug\": \"float-layout\"\n },\n {\n \"depth\": 3,\n \"title\": \"left\",\n \"slug\": \"left\"\n },\n {\n \"depth\": 3,\n \"title\": \"right\",\n \"slug\": \"right\"\n },\n {\n \"depth\": 3,\n \"title\": \"ABSOLUTE POSITIONING VS. FLOATS\",\n \"slug\": \"absolute-positioning-vs-floats\"\n },\n {\n \"depth\": 3,\n \"title\": \"Clear Float\",\n \"slug\": \"clear-float\"\n },\n {\n \"depth\": 4,\n \"title\": \"方法 1: empty div\",\n \"slug\": \"方法-1-empty-div\"\n },\n {\n \"depth\": 4,\n \"title\": \"方法 2:clearfix hack\",\n \"slug\": \"方法-2clearfix-hack\"\n },\n {\n \"depth\": 2,\n \"title\": \"Flexbox\",\n \"slug\": \"flexbox\"\n },\n {\n \"depth\": 3,\n \"title\": \"Flex container\",\n \"slug\": \"flex-container\"\n },\n {\n \"depth\": 3,\n \"title\": \"Flex items\",\n \"slug\": \"flex-items\"\n },\n {\n \"depth\": 3,\n \"title\": \"Propetities\",\n \"slug\": \"propetities\"\n },\n {\n \"depth\": 4,\n \"title\": \"order\",\n \"slug\": \"order\"\n },\n {\n \"depth\": 4,\n \"title\": \"flex-grow\",\n \"slug\": \"flex-grow\"\n },\n {\n \"depth\": 4,\n \"title\": \"flex-basis\",\n \"slug\": \"flex-basis\"\n },\n {\n \"depth\": 4,\n \"title\": \"shorthand\",\n \"slug\": \"shorthand\"\n },\n {\n \"depth\": 2,\n \"title\": \"CSS Grid\",\n \"slug\": \"css-grid\"\n },\n {\n \"depth\": 3,\n \"title\": \"grid container\",\n \"slug\": \"grid-container\"\n },\n {\n \"depth\": 4,\n \"title\": \"Gap\",\n \"slug\": \"gap\"\n },\n {\n \"depth\": 4,\n \"title\": \"align tracks inside containers\",\n \"slug\": \"align-tracks-inside-containers\"\n },\n {\n \"depth\": 3,\n \"title\": \"grid items\",\n \"slug\": \"grid-items\"\n },\n {\n \"depth\": 4,\n \"title\": \"align items inside cells\",\n \"slug\": \"align-items-inside-cells\"\n },\n {\n \"depth\": 3,\n \"title\": \"fr\",\n \"slug\": \"fr\"\n },\n {\n \"depth\": 3,\n \"title\": \"implicit row\",\n \"slug\": \"implicit-row\"\n }\n ],\n \"updated\": \"2022-08-06T10:49:54.807Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"CSS · Add margin to buttons\",\n \"slug\": \"/margin.md\",\n \"tags\": [\n \"CSS Trick\",\n \"CSS\"\n ],\n \"created\": \"2022-01-13T10:04:21.000Z\",\n \"summary\": \"用helper class为单个按钮加margin，防止元素复用时产生不必要的margin\",\n \"lastmod\": \"2022-05-07T05:32:49.156Z\",\n \"path\": \"/margin\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"HTML\",\n \"slug\": \"html\"\n },\n {\n \"depth\": 2,\n \"title\": \"CSS\",\n \"slug\": \"css\"\n },\n {\n \"depth\": 2,\n \"title\": \"为按钮增加内边距\",\n \"slug\": \"为按钮增加内边距\"\n }\n ],\n \"updated\": \"2022-08-06T10:49:40.186Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"CSS · Reusable Grid\",\n \"slug\": \"/grid.md\",\n \"tags\": [\n \"CSS\"\n ],\n \"created\": \"2022-01-13T10:01:44.000Z\",\n \"summary\": \"可复用的CSS Grid设置\",\n \"lastmod\": \"2022-05-07T05:32:52.372Z\",\n \"path\": \"/grid\",\n \"toc\": [\n {\n \"depth\": 4,\n \"title\": \"CSS:\",\n \"slug\": \"css\"\n },\n {\n \"depth\": 4,\n \"title\": \"HTML:\",\n \"slug\": \"html\"\n }\n ],\n \"updated\": \"2022-08-06T10:49:51.803Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"CSS · Rem in CSS\",\n \"slug\": \"/rem-css.md\",\n \"tags\": [\n \"CSS\"\n ],\n \"created\": \"2022-01-12T09:50:27.000Z\",\n \"summary\": \"CSS中的Rem是什么\",\n \"lastmod\": \"2022-05-07T05:32:42.708Z\",\n \"path\": \"/rem-css\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"1. set px\",\n \"slug\": \"1-set-px\"\n },\n {\n \"depth\": 2,\n \"title\": \"2. percentage\",\n \"slug\": \"2-percentage\"\n }\n ],\n \"updated\": \"2022-08-06T10:49:34.711Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"翻译 · Material Design3\",\n \"created\": \"2022-01-03T13:02:17.000Z\",\n \"tags\": [\n \"翻译\"\n ],\n \"categories\": [\n \"翻译\"\n ],\n \"slug\": \"/material.md\",\n \"summary\": \"部分翻译内容\",\n \"lastmod\": \"2022-05-07T05:30:39.510Z\",\n \"path\": \"/material\",\n \"toc\": [],\n \"updated\": \"2022-08-06T10:49:37.342Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"《用户体验要素》- 战略层（产品目标和用户需求）\",\n \"created\": \"2022-01-02T13:08:29.000Z\",\n \"categories\": [\n \"UX学习笔记\"\n ],\n \"tags\": [\n \"《用户体验要素》\",\n \"读书笔记\"\n ],\n \"summary\": \"第三章笔记\",\n \"lastmod\": \"2022-05-07T05:33:16.860Z\",\n \"slug\": \"/用户体验要素3.md\",\n \"path\": \"/用户体验要素3\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"产品目标\",\n \"slug\": \"产品目标\"\n },\n {\n \"depth\": 2,\n \"title\": \"用户需求\",\n \"slug\": \"用户需求\"\n },\n {\n \"depth\": 3,\n \"title\": \"用户细分( user segmentation）\",\n \"slug\": \"用户细分-user-segmentation\"\n },\n {\n \"depth\": 3,\n \"title\": \"用户研究(User Research）\",\n \"slug\": \"用户研究user-research\"\n },\n {\n \"depth\": 2,\n \"title\": \"团队角色和流程\",\n \"slug\": \"团队角色和流程\"\n }\n ],\n \"updated\": \"2022-08-06T10:50:03.925Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"CSS · 基础笔记\",\n \"created\": \"2021-12-06T03:59:47.000Z\",\n \"slug\": \"/css-fundamental.md\",\n \"tags\": [\n \"CSS\"\n ],\n \"lastmod\": \"2022-05-07T05:30:27.910Z\",\n \"path\": \"/css-fundamental\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"css 是什么\",\n \"slug\": \"css-是什么\"\n },\n {\n \"depth\": 2,\n \"title\": \"分类\",\n \"slug\": \"分类\"\n },\n {\n \"depth\": 3,\n \"title\": \"inline CSS\",\n \"slug\": \"inline-css\"\n },\n {\n \"depth\": 3,\n \"title\": \"internal CSS\",\n \"slug\": \"internal-css\"\n },\n {\n \"depth\": 3,\n \"title\": \"external CSS\",\n \"slug\": \"external-css\"\n },\n {\n \"depth\": 2,\n \"title\": \"组成\",\n \"slug\": \"组成\"\n },\n {\n \"depth\": 2,\n \"title\": \"Selectors\",\n \"slug\": \"selectors\"\n },\n {\n \"depth\": 3,\n \"title\": \"descendent selector\",\n \"slug\": \"descendent-selector\"\n },\n {\n \"depth\": 3,\n \"title\": \"line selector\",\n \"slug\": \"line-selector\"\n },\n {\n \"depth\": 2,\n \"title\": \"id\",\n \"slug\": \"id\"\n },\n {\n \"depth\": 3,\n \"title\": \"class attributes\",\n \"slug\": \"class-attributes\"\n },\n {\n \"depth\": 3,\n \"title\": \"universal selector\",\n \"slug\": \"universal-selector\"\n },\n {\n \"depth\": 3,\n \"title\": \"body\",\n \"slug\": \"body\"\n },\n {\n \"depth\": 3,\n \"title\": \"优先级\",\n \"slug\": \"优先级\"\n },\n {\n \"depth\": 4,\n \"title\": \"conflicting between selectors\",\n \"slug\": \"conflicting-between-selectors\"\n },\n {\n \"depth\": 4,\n \"title\": \"inheritance\",\n \"slug\": \"inheritance\"\n },\n {\n \"depth\": 2,\n \"title\": \"颜色\",\n \"slug\": \"颜色\"\n },\n {\n \"depth\": 3,\n \"title\": \"RGB/RGBA\",\n \"slug\": \"rgbrgba\"\n },\n {\n \"depth\": 2,\n \"title\": \"Hexadecimal Colors\",\n \"slug\": \"hexadecimal-colors\"\n },\n {\n \"depth\": 2,\n \"title\": \"Pseudo Class\",\n \"slug\": \"pseudo-class\"\n },\n {\n \"depth\": 3,\n \"title\": \"第一个元素/最后一个元素\",\n \"slug\": \"第一个元素最后一个元素\"\n },\n {\n \"depth\": 3,\n \"title\": \"奇数/偶数 /特定次序\",\n \"slug\": \"奇数偶数-特定次序\"\n },\n {\n \"depth\": 3,\n \"title\": \"多种元素时\",\n \"slug\": \"多种元素时\"\n },\n {\n \"depth\": 3,\n \"title\": \"Style hyperlinks\",\n \"slug\": \"style-hyperlinks\"\n },\n {\n \"depth\": 4,\n \"title\": \"link\",\n \"slug\": \"link\"\n },\n {\n \"depth\": 4,\n \"title\": \"visited\",\n \"slug\": \"visited\"\n },\n {\n \"depth\": 4,\n \"title\": \"hover\",\n \"slug\": \"hover\"\n },\n {\n \"depth\": 4,\n \"title\": \"active\",\n \"slug\": \"active\"\n },\n {\n \"depth\": 2,\n \"title\": \"Pseudo Elements\",\n \"slug\": \"pseudo-elements\"\n },\n {\n \"depth\": 3,\n \"title\": \"adjacent sibiling selector\",\n \"slug\": \"adjacent-sibiling-selector\"\n },\n {\n \"depth\": 3,\n \"title\": \"after\",\n \"slug\": \"after\"\n },\n {\n \"depth\": 3,\n \"title\": \"before\",\n \"slug\": \"before\"\n },\n {\n \"depth\": 2,\n \"title\": \"Box Model\",\n \"slug\": \"box-model\"\n },\n {\n \"depth\": 3,\n \"title\": \"Type of boxes:\",\n \"slug\": \"type-of-boxes\"\n },\n {\n \"depth\": 4,\n \"title\": \"inline boxes\",\n \"slug\": \"inline-boxes\"\n },\n {\n \"depth\": 4,\n \"title\": \"block-level boxes\",\n \"slug\": \"block-level-boxes\"\n },\n {\n \"depth\": 4,\n \"title\": \"inline-block boxes\",\n \"slug\": \"inline-block-boxes\"\n },\n {\n \"depth\": 3,\n \"title\": \"padding\",\n \"slug\": \"padding\"\n },\n {\n \"depth\": 4,\n \"title\": \"reset margin ane padding\",\n \"slug\": \"reset-margin-ane-padding\"\n },\n {\n \"depth\": 3,\n \"title\": \"margin\",\n \"slug\": \"margin\"\n },\n {\n \"depth\": 4,\n \"title\": \"collapsing margins\",\n \"slug\": \"collapsing-margins\"\n },\n {\n \"depth\": 3,\n \"title\": \"Dimensions\",\n \"slug\": \"dimensions\"\n },\n {\n \"depth\": 4,\n \"title\": \"width\",\n \"slug\": \"width\"\n },\n {\n \"depth\": 2,\n \"title\": \"position\",\n \"slug\": \"position\"\n },\n {\n \"depth\": 3,\n \"title\": \"Normal Flow\",\n \"slug\": \"normal-flow\"\n },\n {\n \"depth\": 3,\n \"title\": \"Absolute Position\",\n \"slug\": \"absolute-position\"\n },\n {\n \"depth\": 3,\n \"title\": \"centering page\",\n \"slug\": \"centering-page\"\n },\n {\n \"depth\": 2,\n \"title\": \"基本操作\",\n \"slug\": \"基本操作\"\n },\n {\n \"depth\": 3,\n \"title\": \"CSS 注释\",\n \"slug\": \"css-注释\"\n },\n {\n \"depth\": 3,\n \"title\": \"Fix bugs\",\n \"slug\": \"fix-bugs\"\n }\n ],\n \"updated\": \"2022-08-06T10:49:56.359Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"HTML · 基础笔记\",\n \"created\": \"2021-12-06T03:59:47.000Z\",\n \"slug\": \"/html-basis.md\",\n \"tags\": [\n \"HTML\"\n ],\n \"lastmod\": \"2022-05-07T05:30:47.655Z\",\n \"path\": \"/html-basis\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"HTML 是什么\",\n \"slug\": \"html-是什么\"\n },\n {\n \"depth\": 2,\n \"title\": \"基本组成\",\n \"slug\": \"基本组成\"\n },\n {\n \"depth\": 2,\n \"title\": \"框架\",\n \"slug\": \"框架\"\n },\n {\n \"depth\": 2,\n \"title\": \"attributes\",\n \"slug\": \"attributes\"\n },\n {\n \"depth\": 2,\n \"title\": \"tags\",\n \"slug\": \"tags\"\n },\n {\n \"depth\": 2,\n \"title\": \"HTML entity\",\n \"slug\": \"html-entity\"\n },\n {\n \"depth\": 2,\n \"title\": \"semantic HTML\",\n \"slug\": \"semantic-html\"\n },\n {\n \"depth\": 2,\n \"title\": \"空格\",\n \"slug\": \"空格\"\n },\n {\n \"depth\": 2,\n \"title\": \"当 div 中用 css 设置了图片时\",\n \"slug\": \"当-div-中用-css-设置了图片时\"\n },\n {\n \"depth\": 2,\n \"title\": \"随堂练习\",\n \"slug\": \"随堂练习\"\n },\n {\n \"depth\": 3,\n \"title\": \"商品卡片\",\n \"slug\": \"商品卡片\"\n },\n {\n \"depth\": 3,\n \"title\": \"分页器 pagination\",\n \"slug\": \"分页器-pagination\"\n }\n ],\n \"updated\": \"2022-08-06T10:49:44.906Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"《用户体验要素》- 认识这些要素\",\n \"summary\": \"第二章笔记\",\n \"created\": \"2021-12-06T03:59:47.000Z\",\n \"categories\": [\n \"UX学习笔记\",\n \"《用户体验要素》\"\n ],\n \"tags\": [\n \"读书笔记\",\n \"《用户体验要素》\"\n ],\n \"hidden\": false,\n \"draft\": false,\n \"slug\": \"/用户体验要素2.md\",\n \"lastmod\": \"2022-04-16T12:55:45.413Z\",\n \"path\": \"/用户体验要素2\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"五个层面\",\n \"slug\": \"五个层面\"\n },\n {\n \"depth\": 2,\n \"title\": \"表现层 (surface)\",\n \"slug\": \"表现层-surface\"\n },\n {\n \"depth\": 2,\n \"title\": \"框架层 (skeleton)\",\n \"slug\": \"框架层-skeleton\"\n },\n {\n \"depth\": 2,\n \"title\": \"结构层（structure）\",\n \"slug\": \"结构层structure\"\n },\n {\n \"depth\": 2,\n \"title\": \"范围层 （scope）\",\n \"slug\": \"范围层-scope\"\n },\n {\n \"depth\": 2,\n \"title\": \"战略层 （strategy）\",\n \"slug\": \"战略层-strategy\"\n },\n {\n \"depth\": 2,\n \"title\": \"如何建设这五个层面？\",\n \"slug\": \"如何建设这五个层面\"\n },\n {\n \"depth\": 3,\n \"title\": \"自下而上地建设\",\n \"slug\": \"自下而上地建设\"\n },\n {\n \"depth\": 3,\n \"title\": \"在上一层完成之前开始下一层\",\n \"slug\": \"在上一层完成之前开始下一层\"\n },\n {\n \"depth\": 2,\n \"title\": \"基本的双重性\",\n \"slug\": \"基本的双重性\"\n },\n {\n \"depth\": 3,\n \"title\": \"什么是网页基本的双重性质？\",\n \"slug\": \"什么是网页基本的双重性质\"\n },\n {\n \"depth\": 3,\n \"title\": \"什么是信息型的媒介类产品？\",\n \"slug\": \"什么是信息型的媒介类产品\"\n },\n {\n \"depth\": 3,\n \"title\": \"什么是功能型的平台类产品\",\n \"slug\": \"什么是功能型的平台类产品\"\n },\n {\n \"depth\": 3,\n \"title\": \"用户体验的基本要素是什么？（五个层次、两种类别的产品）\",\n \"slug\": \"用户体验的基本要素是什么五个层次两种类别的产品\"\n }\n ],\n \"updated\": \"2022-08-06T10:50:05.032Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"《用户体验要素》- 用户体验为何如此重要\",\n \"summary\": \"第一章笔记\",\n \"created\": \"2021-11-29T03:06:10.000Z\",\n \"categories\": [\n \"UX学习笔记\",\n \"《用户体验要素》\"\n ],\n \"tags\": [\n \"读书笔记\",\n \"《用户体验要素》\"\n ],\n \"hidden\": false,\n \"draft\": false,\n \"slug\": \"/用户体验要素1.md\",\n \"lastmod\": \"2022-04-16T12:55:42.468Z\",\n \"path\": \"/用户体验要素1\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"什么是用户体验\",\n \"slug\": \"什么是用户体验\"\n },\n {\n \"depth\": 2,\n \"title\": \"为体验而设计：使用第一\",\n \"slug\": \"为体验而设计使用第一\"\n },\n {\n \"depth\": 3,\n \"title\": \"为什么小而美的产品,更容易成功？\",\n \"slug\": \"为什么小而美的产品更容易成功\"\n },\n {\n \"depth\": 2,\n \"title\": \"用户体验和商机\",\n \"slug\": \"用户体验和商机\"\n },\n {\n \"depth\": 3,\n \"title\": \"为什么在网站上，用户体验比别的产品更重要？\",\n \"slug\": \"为什么在网站上用户体验比别的产品更重要\"\n },\n {\n \"depth\": 3,\n \"title\": \"为什么用户体验很重要？有什么作用吗\",\n \"slug\": \"为什么用户体验很重要有什么作用吗\"\n },\n {\n \"depth\": 3,\n \"title\": \"什么是转化率？有什么用？\",\n \"slug\": \"什么是转化率有什么用\"\n },\n {\n \"depth\": 3,\n \"title\": \"改善用户体验，是为了什么？通过什么方式达到？\",\n \"slug\": \"改善用户体验是为了什么通过什么方式达到\"\n },\n {\n \"depth\": 2,\n \"title\": \"以用户为中心的设计\",\n \"slug\": \"以用户为中心的设计\"\n },\n {\n \"depth\": 3,\n \"title\": \"什么是“以用户为中心”的设计？\",\n \"slug\": \"什么是以用户为中心的设计\"\n },\n {\n \"depth\": 3,\n \"title\": \"怎么做？\",\n \"slug\": \"怎么做\"\n }\n ],\n \"updated\": \"2022-08-06T10:50:06.494Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"Evaluation\",\n \"summary\": \"Introduction to User Experience Design｜Week5\",\n \"created\": \"2021-11-18T14:09:49.000Z\",\n \"categories\": [\n \"UX学习笔记\",\n \"Introduction to User Experience Design\"\n ],\n \"tags\": [\n \"UX\"\n ],\n \"slug\": \"/2021-11-18-ux5/index.md\",\n \"path\": \"/2021-11-18-ux5\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"评估\",\n \"slug\": \"评估\"\n },\n {\n \"depth\": 2,\n \"title\": \"分类\",\n \"slug\": \"分类\"\n },\n {\n \"depth\": 3,\n \"title\": \"形成性评估\",\n \"slug\": \"形成性评估\"\n },\n {\n \"depth\": 3,\n \"title\": \"总结性评估\",\n \"slug\": \"总结性评估\"\n },\n {\n \"depth\": 2,\n \"title\": \"如何评估\",\n \"slug\": \"如何评估\"\n },\n {\n \"depth\": 3,\n \"title\": \"数据收集\",\n \"slug\": \"数据收集\"\n },\n {\n \"depth\": 3,\n \"title\": \"衡量\",\n \"slug\": \"衡量\"\n },\n {\n \"depth\": 3,\n \"title\": \"可学习性\",\n \"slug\": \"可学习性\"\n },\n {\n \"depth\": 3,\n \"title\": \"可记忆性\",\n \"slug\": \"可记忆性\"\n },\n {\n \"depth\": 3,\n \"title\": \"主观情感评估\",\n \"slug\": \"主观情感评估\"\n },\n {\n \"depth\": 2,\n \"title\": \"相关资源\",\n \"slug\": \"相关资源\"\n },\n {\n \"depth\": 2,\n \"title\": \"推荐教材\",\n \"slug\": \"推荐教材\"\n },\n {\n \"depth\": 3,\n \"title\": \"Trade Book\",\n \"slug\": \"trade-book\"\n },\n {\n \"depth\": 3,\n \"title\": \"Text Books\",\n \"slug\": \"text-books\"\n },\n {\n \"depth\": 2,\n \"title\": \"参考网站\",\n \"slug\": \"参考网站\"\n }\n ],\n \"updated\": \"2022-08-06T10:47:38.841Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"Prototyping\",\n \"summary\": \"Introduction to User Experience Design｜Week4\",\n \"created\": \"2021-11-18T13:26:41.000Z\",\n \"categories\": [\n \"UX学习笔记\",\n \"Introduction to User Experience Design\"\n ],\n \"tags\": [\n \"UX\"\n ],\n \"slug\": \"/2021-11-18-ux4/index.md\",\n \"path\": \"/2021-11-18-ux4\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"关于 Prototyping\",\n \"slug\": \"关于-prototyping\"\n },\n {\n \"depth\": 3,\n \"title\": \"什么是原型开发\",\n \"slug\": \"什么是原型开发\"\n },\n {\n \"depth\": 3,\n \"title\": \"原型开发的作用\",\n \"slug\": \"原型开发的作用\"\n },\n {\n \"depth\": 3,\n \"title\": \"水平原型\",\n \"slug\": \"水平原型\"\n },\n {\n \"depth\": 3,\n \"title\": \"垂直原型\",\n \"slug\": \"垂直原型\"\n },\n {\n \"depth\": 2,\n \"title\": \"低保真 Lofi Prototype\",\n \"slug\": \"低保真-lofi-prototype\"\n },\n {\n \"depth\": 3,\n \"title\": \"低保真和高保真的区别\",\n \"slug\": \"低保真和高保真的区别\"\n },\n {\n \"depth\": 3,\n \"title\": \"注意事项\",\n \"slug\": \"注意事项\"\n },\n {\n \"depth\": 3,\n \"title\": \"三种形式\",\n \"slug\": \"三种形式\"\n },\n {\n \"depth\": 4,\n \"title\": \"1. 草图\",\n \"slug\": \"1-草图\"\n },\n {\n \"depth\": 4,\n \"title\": \"2. 故事版\",\n \"slug\": \"2-故事版\"\n },\n {\n \"depth\": 4,\n \"title\": \"3.卡片原型\",\n \"slug\": \"3卡片原型\"\n },\n {\n \"depth\": 2,\n \"title\": \"其他原型方式\",\n \"slug\": \"其他原型方式\"\n },\n {\n \"depth\": 3,\n \"title\": \"绿野仙踪/奥茨法师\",\n \"slug\": \"绿野仙踪奥茨法师\"\n },\n {\n \"depth\": 3,\n \"title\": \"概念验证视频\",\n \"slug\": \"概念验证视频\"\n },\n {\n \"depth\": 3,\n \"title\": \"隐喻技术\",\n \"slug\": \"隐喻技术\"\n },\n {\n \"depth\": 2,\n \"title\": \"相关资源\",\n \"slug\": \"相关资源\"\n },\n {\n \"depth\": 3,\n \"title\": \"Resources and Tools for Protoyping 1\",\n \"slug\": \"resources-and-tools-for-protoyping-1\"\n },\n {\n \"depth\": 3,\n \"title\": \"Tools\",\n \"slug\": \"tools\"\n },\n {\n \"depth\": 3,\n \"title\": \"Resources for Prototyping 2\",\n \"slug\": \"resources-for-prototyping-2\"\n }\n ],\n \"updated\": \"2022-08-06T10:49:10.016Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"Design Alternatives\",\n \"summary\": \"Introduction to User Experience Design｜Week3\",\n \"created\": \"2021-11-14T03:18:45.000Z\",\n \"categories\": [\n \"UX学习笔记\",\n \"Introduction to User Experience Design\"\n ],\n \"tags\": [\n \"UX\"\n ],\n \"lastmod\": \"2022-04-16T12:56:27.924Z\",\n \"slug\": \"/2021-11-14-ux3/index.md\",\n \"path\": \"/2021-11-14-ux3\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"Review of Design Goals 审查设计目标\",\n \"slug\": \"review-of-design-goals-审查设计目标\"\n },\n {\n \"depth\": 3,\n \"title\": \"用户体验的核心目标\",\n \"slug\": \"用户体验的核心目标\"\n },\n {\n \"depth\": 3,\n \"title\": \"设计的定义\",\n \"slug\": \"设计的定义\"\n },\n {\n \"depth\": 3,\n \"title\": \"设计的目标\",\n \"slug\": \"设计的目标\"\n },\n {\n \"depth\": 3,\n \"title\": \"设计时，需考虑的三个方面\",\n \"slug\": \"设计时需考虑的三个方面\"\n },\n {\n \"depth\": 2,\n \"title\": \"Design Alternatives 设计替代方案\",\n \"slug\": \"design-alternatives-设计替代方案\"\n },\n {\n \"depth\": 3,\n \"title\": \"目标\",\n \"slug\": \"目标\"\n },\n {\n \"depth\": 3,\n \"title\": \"关键\",\n \"slug\": \"关键\"\n },\n {\n \"depth\": 3,\n \"title\": \"Road map 路线\",\n \"slug\": \"road-map-路线\"\n }\n ],\n \"updated\": \"2022-08-06T10:49:15.281Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"Requirement Gathering\",\n \"summary\": \"Introduction to User Experience Design｜Week2\",\n \"created\": \"2021-11-09T14:26:49.000Z\",\n \"categories\": [\n \"UX学习笔记\",\n \"Introduction to User Experience Design\"\n ],\n \"tags\": [\n \"UX\"\n ],\n \"slug\": \"/2021-11-09-ux2/index.md\",\n \"path\": \"/2021-11-09-ux2\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"Overview\",\n \"slug\": \"overview\"\n },\n {\n \"depth\": 2,\n \"title\": \"Types of Users and Types of Data\",\n \"slug\": \"types-of-users-and-types-of-data\"\n },\n {\n \"depth\": 3,\n \"title\": \"数据类型\",\n \"slug\": \"数据类型\"\n },\n {\n \"depth\": 4,\n \"title\": \"定量\",\n \"slug\": \"定量\"\n },\n {\n \"depth\": 4,\n \"title\": \"定性\",\n \"slug\": \"定性\"\n },\n {\n \"depth\": 3,\n \"title\": \"将用户视为利益相关者的三个类型\",\n \"slug\": \"将用户视为利益相关者的三个类型\"\n },\n {\n \"depth\": 3,\n \"title\": \"了解利益相关者的意义\",\n \"slug\": \"了解利益相关者的意义\"\n },\n {\n \"depth\": 2,\n \"title\": \"Discovery Technique Overview\",\n \"slug\": \"discovery-technique-overview\"\n },\n {\n \"depth\": 3,\n \"title\": \"四种调研方法\",\n \"slug\": \"四种调研方法\"\n },\n {\n \"depth\": 3,\n \"title\": \"交互程度\",\n \"slug\": \"交互程度\"\n },\n {\n \"depth\": 3,\n \"title\": \"进行的场景\",\n \"slug\": \"进行的场景\"\n },\n {\n \"depth\": 3,\n \"title\": \"在设计周期中迭代\",\n \"slug\": \"在设计周期中迭代\"\n },\n {\n \"depth\": 2,\n \"title\": \"Naturalistic Observation 自然观察\",\n \"slug\": \"naturalistic-observation-自然观察\"\n },\n {\n \"depth\": 3,\n \"title\": \"是什么\",\n \"slug\": \"是什么\"\n },\n {\n \"depth\": 3,\n \"title\": \"如何做\",\n \"slug\": \"如何做\"\n },\n {\n \"depth\": 3,\n \"title\": \"数据\",\n \"slug\": \"数据\"\n },\n {\n \"depth\": 3,\n \"title\": \"优点\",\n \"slug\": \"优点\"\n },\n {\n \"depth\": 3,\n \"title\": \"缺点\",\n \"slug\": \"缺点\"\n },\n {\n \"depth\": 3,\n \"title\": \"道德局限\",\n \"slug\": \"道德局限\"\n },\n {\n \"depth\": 3,\n \"title\": \"在设计流程中\",\n \"slug\": \"在设计流程中\"\n },\n {\n \"depth\": 2,\n \"title\": \"Survey 问卷\",\n \"slug\": \"survey-问卷\"\n },\n {\n \"depth\": 3,\n \"title\": \"是什么\",\n \"slug\": \"是什么-1\"\n },\n {\n \"depth\": 3,\n \"title\": \"如何做\",\n \"slug\": \"如何做-1\"\n },\n {\n \"depth\": 3,\n \"title\": \"数据\",\n \"slug\": \"数据-1\"\n },\n {\n \"depth\": 4,\n \"title\": \"1.定性-封闭性问题\",\n \"slug\": \"1定性-封闭性问题\"\n },\n {\n \"depth\": 4,\n \"title\": \"2.定量-开放性问题\",\n \"slug\": \"2定量-开放性问题\"\n },\n {\n \"depth\": 3,\n \"title\": \"优点\",\n \"slug\": \"优点-1\"\n },\n {\n \"depth\": 3,\n \"title\": \"缺点\",\n \"slug\": \"缺点-1\"\n },\n {\n \"depth\": 3,\n \"title\": \"在设计流程中\",\n \"slug\": \"在设计流程中-1\"\n },\n {\n \"depth\": 2,\n \"title\": \"Focus group 焦点小组\",\n \"slug\": \"focus-group-焦点小组\"\n },\n {\n \"depth\": 3,\n \"title\": \"是什么\",\n \"slug\": \"是什么-2\"\n },\n {\n \"depth\": 3,\n \"title\": \"如何做\",\n \"slug\": \"如何做-2\"\n },\n {\n \"depth\": 4,\n \"title\": \"组成\",\n \"slug\": \"组成\"\n },\n {\n \"depth\": 3,\n \"title\": \"数据\",\n \"slug\": \"数据-2\"\n },\n {\n \"depth\": 3,\n \"title\": \"优点\",\n \"slug\": \"优点-2\"\n },\n {\n \"depth\": 3,\n \"title\": \"缺点\",\n \"slug\": \"缺点-2\"\n },\n {\n \"depth\": 3,\n \"title\": \"在设计流程中\",\n \"slug\": \"在设计流程中-2\"\n },\n {\n \"depth\": 2,\n \"title\": \"Interviews\",\n \"slug\": \"interviews\"\n },\n {\n \"depth\": 3,\n \"title\": \"是什么\",\n \"slug\": \"是什么-3\"\n },\n {\n \"depth\": 3,\n \"title\": \"如何做\",\n \"slug\": \"如何做-3\"\n },\n {\n \"depth\": 3,\n \"title\": \"数据\",\n \"slug\": \"数据-3\"\n },\n {\n \"depth\": 3,\n \"title\": \"优点\",\n \"slug\": \"优点-3\"\n },\n {\n \"depth\": 3,\n \"title\": \"缺点\",\n \"slug\": \"缺点-3\"\n },\n {\n \"depth\": 3,\n \"title\": \"在设计流程中\",\n \"slug\": \"在设计流程中-3\"\n },\n {\n \"depth\": 2,\n \"title\": \"User Results 用户数据处理\",\n \"slug\": \"user-results-用户数据处理\"\n },\n {\n \"depth\": 3,\n \"title\": \"描述性统计信息\",\n \"slug\": \"描述性统计信息\"\n },\n {\n \"depth\": 3,\n \"title\": \"用户特征表\",\n \"slug\": \"用户特征表\"\n },\n {\n \"depth\": 3,\n \"title\": \"人物画像 Persona\",\n \"slug\": \"人物画像-persona\"\n },\n {\n \"depth\": 2,\n \"title\": \"Presenting Task Findings\",\n \"slug\": \"presenting-task-findings\"\n },\n {\n \"depth\": 3,\n \"title\": \"Scenario\",\n \"slug\": \"scenario\"\n },\n {\n \"depth\": 4,\n \"title\": \"是什么\",\n \"slug\": \"是什么-4\"\n },\n {\n \"depth\": 4,\n \"title\": \"作用\",\n \"slug\": \"作用\"\n },\n {\n \"depth\": 3,\n \"title\": \"Essential Case Study\",\n \"slug\": \"essential-case-study\"\n },\n {\n \"depth\": 4,\n \"title\": \"三个要素\",\n \"slug\": \"三个要素\"\n },\n {\n \"depth\": 3,\n \"title\": \"Hierarchical Task Analysis\",\n \"slug\": \"hierarchical-task-analysis\"\n },\n {\n \"depth\": 3,\n \"title\": \"Current UI Critique\",\n \"slug\": \"current-ui-critique\"\n },\n {\n \"depth\": 4,\n \"title\": \"步骤\",\n \"slug\": \"步骤\"\n },\n {\n \"depth\": 2,\n \"title\": \"相关资源\",\n \"slug\": \"相关资源\"\n }\n ],\n \"updated\": \"2022-08-06T10:49:17.439Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"Overview of User Experience Design\",\n \"summary\": \"Introduction to User Experience Design｜Week1\",\n \"created\": \"2021-11-08T02:54:40.000Z\",\n \"tags\": [\n \"UX\"\n ],\n \"slug\": \"/2021-11-08-ux1/index.md\",\n \"path\": \"/2021-11-08-ux1\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"课程简介\",\n \"slug\": \"课程简介\"\n },\n {\n \"depth\": 2,\n \"title\": \"Week 1 笔记\",\n \"slug\": \"week-1-笔记\"\n },\n {\n \"depth\": 3,\n \"title\": \"什么是 ux？\",\n \"slug\": \"什么是-ux\"\n },\n {\n \"depth\": 3,\n \"title\": \"用户体验设计的核心概念\",\n \"slug\": \"用户体验设计的核心概念\"\n },\n {\n \"depth\": 3,\n \"title\": \"什么是用户\",\n \"slug\": \"什么是用户\"\n },\n {\n \"depth\": 3,\n \"title\": \"什么是界面\",\n \"slug\": \"什么是界面\"\n },\n {\n \"depth\": 3,\n \"title\": \"用户体验设计的目标\",\n \"slug\": \"用户体验设计的目标\"\n },\n {\n \"depth\": 3,\n \"title\": \"界面设计环 (四个步骤)\",\n \"slug\": \"界面设计环-四个步骤\"\n },\n {\n \"depth\": 4,\n \"title\": \"Step1：Requirements Gathering 收集需求\",\n \"slug\": \"step1requirements-gathering-收集需求\"\n },\n {\n \"depth\": 4,\n \"title\": \"Step 2：Design Alternatives 设计方案\",\n \"slug\": \"step-2design-alternatives-设计方案\"\n },\n {\n \"depth\": 4,\n \"title\": \"Step 3：Prototyping 原型\",\n \"slug\": \"step-3prototyping-原型\"\n },\n {\n \"depth\": 4,\n \"title\": \"Step 4：Evaluation 评估测试\",\n \"slug\": \"step-4evaluation-评估测试\"\n },\n {\n \"depth\": 3,\n \"title\": \"什么样的界面是“实用”的？\",\n \"slug\": \"什么样的界面是实用的\"\n },\n {\n \"depth\": 3,\n \"title\": \"好设计的三个特征\",\n \"slug\": \"好设计的三个特征\"\n },\n {\n \"depth\": 4,\n \"title\": \"1 - Affordance (示能)\",\n \"slug\": \"1---affordance-示能\"\n },\n {\n \"depth\": 4,\n \"title\": \"2 - Signifiers (意符)\",\n \"slug\": \"2---signifiers-意符\"\n },\n {\n \"depth\": 4,\n \"title\": \"3 - Feedback (反馈)\",\n \"slug\": \"3---feedback-反馈\"\n },\n {\n \"depth\": 3,\n \"title\": \"如何与“用户”接洽\",\n \"slug\": \"如何与用户接洽\"\n },\n {\n \"depth\": 4,\n \"title\": \"三个步骤\",\n \"slug\": \"三个步骤\"\n }\n ],\n \"updated\": \"2022-08-06T10:49:20.887Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"全球商业化中的设计\",\n \"summary\": \"《设计心理学 1》第七章——本书的总结\",\n \"created\": \"2021-11-03T03:59:18.000Z\",\n \"categories\": [\n \"设计心理学\"\n ],\n \"tags\": [\n \"设计心理学1\",\n \"读书笔记\"\n ],\n \"slug\": \"/设计心理学1-7.md\",\n \"lastmod\": \"2022-04-16T12:55:38.967Z\",\n \"path\": \"/设计心理学1-7\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"1.竞争压力\",\n \"slug\": \"1竞争压力\"\n },\n {\n \"depth\": 2,\n \"title\": \"2.新技术推动变革\",\n \"slug\": \"2新技术推动变革\"\n },\n {\n \"depth\": 2,\n \"title\": \"3.新产品上市需要多长时间\",\n \"slug\": \"3新产品上市需要多长时间\"\n },\n {\n \"depth\": 2,\n \"title\": \"4.创新的两种形式：渐进式和颠覆式\",\n \"slug\": \"4创新的两种形式渐进式和颠覆式\"\n },\n {\n \"depth\": 2,\n \"title\": \"5. 设计心理学：1988 ～ 2038\",\n \"slug\": \"5-设计心理学1988--2038\"\n },\n {\n \"depth\": 2,\n \"title\": \"6.书籍的未来\",\n \"slug\": \"6书籍的未来\"\n },\n {\n \"depth\": 2,\n \"title\": \"7. 设计的道义和责任\",\n \"slug\": \"7-设计的道义和责任\"\n },\n {\n \"depth\": 2,\n \"title\": \"8. 设计思维和思考设计\",\n \"slug\": \"8-设计思维和思考设计\"\n }\n ],\n \"updated\": \"2022-08-06T10:50:07.505Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"设计思维\",\n \"created\": \"2021-11-03T03:49:10.353Z\",\n \"categories\": [\n \"设计心理学\"\n ],\n \"tags\": [\n \"设计心理学1\",\n \"读书笔记\"\n ],\n \"draft\": false,\n \"summary\": \"《设计心理学 1》第六章——设计需要探究问题的来源，而不只是停留在表面\",\n \"lastmod\": \"2022-05-07T05:31:58.650Z\",\n \"slug\": \"/设计心理学1-6.md\",\n \"path\": \"/设计心理学1-6\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"1. 解决正确的问题\",\n \"slug\": \"1-解决正确的问题\"\n },\n {\n \"depth\": 2,\n \"title\": \"2. 双钻设计模式\",\n \"slug\": \"2-双钻设计模式\"\n },\n {\n \"depth\": 3,\n \"title\": \"四个步骤（发散->聚焦）\",\n \"slug\": \"四个步骤发散-聚焦\"\n },\n {\n \"depth\": 2,\n \"title\": \"3. 以人为本的设计流程\",\n \"slug\": \"3-以人为本的设计流程\"\n },\n {\n \"depth\": 3,\n \"title\": \"1.观察\",\n \"slug\": \"1观察\"\n },\n {\n \"depth\": 3,\n \"title\": \"2. 激发创意（构思）\",\n \"slug\": \"2-激发创意构思\"\n },\n {\n \"depth\": 3,\n \"title\": \"3.打样（原型）\",\n \"slug\": \"3打样原型\"\n },\n {\n \"depth\": 4,\n \"title\": \"4.测试\",\n \"slug\": \"4测试\"\n },\n {\n \"depth\": 2,\n \"title\": \"4.我刚告诉你什么？那根本行不通\",\n \"slug\": \"4我刚告诉你什么那根本行不通\"\n },\n {\n \"depth\": 2,\n \"title\": \"5.设计的挑战\",\n \"slug\": \"5设计的挑战\"\n },\n {\n \"depth\": 2,\n \"title\": \"6. 复杂是好事，混乱惹麻烦\",\n \"slug\": \"6-复杂是好事混乱惹麻烦\"\n },\n {\n \"depth\": 2,\n \"title\": \"7.标准化和技术\",\n \"slug\": \"7标准化和技术\"\n },\n {\n \"depth\": 2,\n \"title\": \"8.故意制作困难\",\n \"slug\": \"8故意制作困难\"\n },\n {\n \"depth\": 2,\n \"title\": \"9. 设计：为了人类发展科技\",\n \"slug\": \"9-设计为了人类发展科技\"\n }\n ],\n \"updated\": \"2022-08-06T10:50:08.975Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"人为差错？不，拙劣的设计\",\n \"summary\": \"《设计心理学 1》第五章——设计师经常严重误解人心理的局限性，要求人像机器一样工作\",\n \"created\": \"2021-10-27T12:22:17.000Z\",\n \"math\": \"falase\",\n \"categories\": [\n \"设计心理学\"\n ],\n \"tags\": [\n \"设计心理学1\",\n \"读书笔记\"\n ],\n \"draft\": false,\n \"lastmod\": \"2022-04-16T12:55:20.101Z\",\n \"slug\": \"/设计心理学1-5.md\",\n \"path\": \"/设计心理学1-5\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"1.何以出错\",\n \"slug\": \"1何以出错\"\n },\n {\n \"depth\": 3,\n \"title\": \"出错的原因\",\n \"slug\": \"出错的原因\"\n },\n {\n \"depth\": 3,\n \"title\": \"解决错误的方法\",\n \"slug\": \"解决错误的方法\"\n },\n {\n \"depth\": 3,\n \"title\": \"差错之外：故意犯错\",\n \"slug\": \"差错之外故意犯错\"\n },\n {\n \"depth\": 2,\n \"title\": \"2.差错的两种类型：失误和错误\",\n \"slug\": \"2差错的两种类型失误和错误\"\n },\n {\n \"depth\": 3,\n \"title\": \"差错\",\n \"slug\": \"差错\"\n },\n {\n \"depth\": 3,\n \"title\": \"差错和行动的七个阶段\",\n \"slug\": \"差错和行动的七个阶段\"\n },\n {\n \"depth\": 3,\n \"title\": \"失误\",\n \"slug\": \"失误\"\n },\n {\n \"depth\": 4,\n \"title\": \"行动失误\",\n \"slug\": \"行动失误\"\n },\n {\n \"depth\": 5,\n \"title\": \"1. 撷取性失误\",\n \"slug\": \"1-撷取性失误\"\n },\n {\n \"depth\": 5,\n \"title\": \"2. 描述相似性失误\",\n \"slug\": \"2-描述相似性失误\"\n },\n {\n \"depth\": 5,\n \"title\": \"3. 功能状态失误\",\n \"slug\": \"3-功能状态失误\"\n },\n {\n \"depth\": 4,\n \"title\": \"记忆失误\",\n \"slug\": \"记忆失误\"\n },\n {\n \"depth\": 2,\n \"title\": \"3.错误的分类\",\n \"slug\": \"3错误的分类\"\n },\n {\n \"depth\": 3,\n \"title\": \"错误\",\n \"slug\": \"错误\"\n },\n {\n \"depth\": 4,\n \"title\": \"1. 基于规则的错误（违反规则）\",\n \"slug\": \"1-基于规则的错误违反规则\"\n },\n {\n \"depth\": 4,\n \"title\": \"2. 基于知识的错误（缺乏知识）\",\n \"slug\": \"2-基于知识的错误缺乏知识\"\n },\n {\n \"depth\": 4,\n \"title\": \"3. 记忆失效的错误\",\n \"slug\": \"3-记忆失效的错误\"\n },\n {\n \"depth\": 2,\n \"title\": \"4.社会和习俗压力\",\n \"slug\": \"4社会和习俗压力\"\n },\n {\n \"depth\": 3,\n \"title\": \"压力\",\n \"slug\": \"压力\"\n },\n {\n \"depth\": 3,\n \"title\": \"检查清单\",\n \"slug\": \"检查清单\"\n },\n {\n \"depth\": 2,\n \"title\": \"5、差错报告\",\n \"slug\": \"5差错报告\"\n },\n {\n \"depth\": 3,\n \"title\": \"自动化（JIDOKA）\",\n \"slug\": \"自动化jidoka\"\n },\n {\n \"depth\": 3,\n \"title\": \"防呆（POKA-YOKE）\",\n \"slug\": \"防呆poka-yoke\"\n },\n {\n \"depth\": 3,\n \"title\": \"航空安全报告体系\",\n \"slug\": \"航空安全报告体系\"\n },\n {\n \"depth\": 2,\n \"title\": \"6.甄别差错\",\n \"slug\": \"6甄别差错\"\n },\n {\n \"depth\": 3,\n \"title\": \"为什么甄别差错是困难的\",\n \"slug\": \"为什么甄别差错是困难的\"\n },\n {\n \"depth\": 4,\n \"title\": \"甄别失误\",\n \"slug\": \"甄别失误\"\n },\n {\n \"depth\": 4,\n \"title\": \"甄别错误\",\n \"slug\": \"甄别错误\"\n },\n {\n \"depth\": 4,\n \"title\": \"记忆失效性（失误/错误）\",\n \"slug\": \"记忆失效性失误错误\"\n },\n {\n \"depth\": 3,\n \"title\": \"为错误辩解\",\n \"slug\": \"为错误辩解\"\n },\n {\n \"depth\": 3,\n \"title\": \"事故分析要置身于真实情境\",\n \"slug\": \"事故分析要置身于真实情境\"\n },\n {\n \"depth\": 4,\n \"title\": \"事故发生时\",\n \"slug\": \"事故发生时\"\n },\n {\n \"depth\": 4,\n \"title\": \"事故发生后\",\n \"slug\": \"事故发生后\"\n },\n {\n \"depth\": 4,\n \"title\": \"事故分析应\",\n \"slug\": \"事故分析应\"\n },\n {\n \"depth\": 2,\n \"title\": \"7.为差错设计\",\n \"slug\": \"7为差错设计\"\n },\n {\n \"depth\": 3,\n \"title\": \"基本原则\",\n \"slug\": \"基本原则\"\n },\n {\n \"depth\": 3,\n \"title\": \"记忆中断\",\n \"slug\": \"记忆中断\"\n },\n {\n \"depth\": 3,\n \"title\": \"警示信号存在的问题\",\n \"slug\": \"警示信号存在的问题\"\n },\n {\n \"depth\": 3,\n \"title\": \"为差错设计的方法\",\n \"slug\": \"为差错设计的方法\"\n },\n {\n \"depth\": 4,\n \"title\": \"研究差错\",\n \"slug\": \"研究差错\"\n },\n {\n \"depth\": 4,\n \"title\": \"增加约束\",\n \"slug\": \"增加约束\"\n },\n {\n \"depth\": 4,\n \"title\": \"撤销\",\n \"slug\": \"撤销\"\n },\n {\n \"depth\": 4,\n \"title\": \"差错信息确认\",\n \"slug\": \"差错信息确认\"\n },\n {\n \"depth\": 4,\n \"title\": \"合理性检查\",\n \"slug\": \"合理性检查\"\n },\n {\n \"depth\": 4,\n \"title\": \"减小失误\",\n \"slug\": \"减小失误\"\n },\n {\n \"depth\": 3,\n \"title\": \"从差错到事故——瑞士奶酪模型\",\n \"slug\": \"从差错到事故瑞士奶酪模型\"\n },\n {\n \"depth\": 2,\n \"title\": \"8.良好的设计还不够\",\n \"slug\": \"8良好的设计还不够\"\n },\n {\n \"depth\": 2,\n \"title\": \"9.修补回复工程\",\n \"slug\": \"9修补回复工程\"\n },\n {\n \"depth\": 3,\n \"title\": \"是什么\",\n \"slug\": \"是什么\"\n },\n {\n \"depth\": 3,\n \"title\": \"如何做\",\n \"slug\": \"如何做\"\n },\n {\n \"depth\": 2,\n \"title\": \"10.自动化的悖论\",\n \"slug\": \"10自动化的悖论\"\n },\n {\n \"depth\": 3,\n \"title\": \"故障时结果难以估计\",\n \"slug\": \"故障时结果难以估计\"\n },\n {\n \"depth\": 3,\n \"title\": \"悖论\",\n \"slug\": \"悖论\"\n },\n {\n \"depth\": 2,\n \"title\": \"11.应对差错的设计原则\",\n \"slug\": \"11应对差错的设计原则\"\n },\n {\n \"depth\": 3,\n \"title\": \"人和机器协同应工作\",\n \"slug\": \"人和机器协同应工作\"\n },\n {\n \"depth\": 3,\n \"title\": \"关键设计原则\",\n \"slug\": \"关键设计原则\"\n }\n ],\n \"updated\": \"2022-08-06T10:50:11.112Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"知晓：约束、可视性和反馈\",\n \"tags\": [\n \"设计心理学1\",\n \"读书笔记\"\n ],\n \"categories\": [\n \"设计心理学\"\n ],\n \"keywords\": [\n \"设计心理学\"\n ],\n \"created\": \"2021-10-22T20:21:44.000Z\",\n \"summary\": \"《设计心理学 1》第四章——遇到一个新的设备或状况，设计师应如何提供重要信息，以便人们知道如何操作\",\n \"lastmod\": \"2022-04-16T12:55:16.673Z\",\n \"slug\": \"/设计心理学1-4.md\",\n \"path\": \"/设计心理学1-4\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"章前\",\n \"slug\": \"章前\"\n },\n {\n \"depth\": 3,\n \"title\": \"外界的知识：\",\n \"slug\": \"外界的知识\"\n },\n {\n \"depth\": 3,\n \"title\": \"头脑中的知识\",\n \"slug\": \"头脑中的知识\"\n },\n {\n \"depth\": 2,\n \"title\": \"1. 四种约束因素：物理、文化、语义和逻辑\",\n \"slug\": \"1-四种约束因素物理文化语义和逻辑\"\n },\n {\n \"depth\": 3,\n \"title\": \"物理约束\",\n \"slug\": \"物理约束\"\n },\n {\n \"depth\": 3,\n \"title\": \"文化约束\",\n \"slug\": \"文化约束\"\n },\n {\n \"depth\": 3,\n \"title\": \"语义约束\",\n \"slug\": \"语义约束\"\n },\n {\n \"depth\": 3,\n \"title\": \"逻辑约束\",\n \"slug\": \"逻辑约束\"\n },\n {\n \"depth\": 2,\n \"title\": \"2. 示能、意符和约束在日常用品设计中的应用\",\n \"slug\": \"2-示能意符和约束在日常用品设计中的应用\"\n },\n {\n \"depth\": 3,\n \"title\": \"门的问题\",\n \"slug\": \"门的问题\"\n },\n {\n \"depth\": 3,\n \"title\": \"开关的问题\",\n \"slug\": \"开关的问题\"\n },\n {\n \"depth\": 3,\n \"title\": \"任务分析\",\n \"slug\": \"任务分析\"\n },\n {\n \"depth\": 3,\n \"title\": \"以用户为中心的设计\",\n \"slug\": \"以用户为中心的设计\"\n },\n {\n \"depth\": 3,\n \"title\": \"以活动为中心的控制\",\n \"slug\": \"以活动为中心的控制\"\n },\n {\n \"depth\": 2,\n \"title\": \"3. 引导行为的约束力\",\n \"slug\": \"3-引导行为的约束力\"\n },\n {\n \"depth\": 3,\n \"title\": \"是什么\",\n \"slug\": \"是什么\"\n },\n {\n \"depth\": 3,\n \"title\": \"作用\",\n \"slug\": \"作用\"\n },\n {\n \"depth\": 3,\n \"title\": \"例子\",\n \"slug\": \"例子\"\n },\n {\n \"depth\": 3,\n \"title\": \"三种强制方式\",\n \"slug\": \"三种强制方式\"\n },\n {\n \"depth\": 4,\n \"title\": \"互锁\",\n \"slug\": \"互锁\"\n },\n {\n \"depth\": 4,\n \"title\": \"自锁\",\n \"slug\": \"自锁\"\n },\n {\n \"depth\": 4,\n \"title\": \"反锁\",\n \"slug\": \"反锁\"\n },\n {\n \"depth\": 2,\n \"title\": \"4. 惯例、约束和示能\",\n \"slug\": \"4-惯例约束和示能\"\n },\n {\n \"depth\": 2,\n \"title\": \"5. 水龙头：关于设计的历史案例\",\n \"slug\": \"5-水龙头关于设计的历史案例\"\n },\n {\n \"depth\": 2,\n \"title\": \"6. 利用声音作为意符\",\n \"slug\": \"6-利用声音作为意符\"\n },\n {\n \"depth\": 3,\n \"title\": \"为什么\",\n \"slug\": \"为什么\"\n },\n {\n \"depth\": 3,\n \"title\": \"应提供什么信息：\",\n \"slug\": \"应提供什么信息\"\n },\n {\n \"depth\": 3,\n \"title\": \"如何提供\",\n \"slug\": \"如何提供\"\n },\n {\n \"depth\": 3,\n \"title\": \"例子\",\n \"slug\": \"例子-1\"\n },\n {\n \"depth\": 3,\n \"title\": \"“拟真”(skeuomorphic)\",\n \"slug\": \"拟真skeuomorphic\"\n }\n ],\n \"updated\": \"2022-08-06T10:50:12.946Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"draft\": false,\n \"title\": \"头脑中的知识和外界知识\",\n \"tags\": [\n \"设计心理学1\",\n \"读书笔记\"\n ],\n \"categories\": [\n \"设计心理学\"\n ],\n \"keywords\": [\n \"设计心理学\"\n ],\n \"created\": \"2021-10-20T17:08:47.371Z\",\n \"summary\": \"《设计心理学 1》第三章——并非精确行为需要的所有知识都得储存在头脑里\",\n \"lastmod\": \"2022-04-16T12:55:13.235Z\",\n \"slug\": \"/设计心理学1-3.md\",\n \"path\": \"/设计心理学1-3\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"1. 含糊的知识引导精确的行为\",\n \"slug\": \"1-含糊的知识引导精确的行为\"\n },\n {\n \"depth\": 3,\n \"title\": \"人们不需要完全精确的知识来支撑引导他们的行为。\",\n \"slug\": \"人们不需要完全精确的知识来支撑引导他们的行为\"\n },\n {\n \"depth\": 3,\n \"title\": \"两种类型的知识：\",\n \"slug\": \"两种类型的知识\"\n },\n {\n \"depth\": 2,\n \"title\": \"2. 记忆是储存在头脑中的知识\",\n \"slug\": \"2-记忆是储存在头脑中的知识\"\n },\n {\n \"depth\": 2,\n \"title\": \"3. 记忆的结构\",\n \"slug\": \"3-记忆的结构\"\n },\n {\n \"depth\": 3,\n \"title\": \"两种记忆类型\",\n \"slug\": \"两种记忆类型\"\n },\n {\n \"depth\": 4,\n \"title\": \"1. 短时记忆（工作记忆）\",\n \"slug\": \"1-短时记忆工作记忆\"\n },\n {\n \"depth\": 4,\n \"title\": \"2. 长时记忆（LTM /long-term memory)\",\n \"slug\": \"2-长时记忆ltm-long-term-memory\"\n },\n {\n \"depth\": 2,\n \"title\": \"4.近似模型：现实世界里的记忆\",\n \"slug\": \"4近似模型现实世界里的记忆\"\n },\n {\n \"depth\": 2,\n \"title\": \"5.头脑中的知识\",\n \"slug\": \"5头脑中的知识\"\n },\n {\n \"depth\": 3,\n \"title\": \"前瞻记忆\",\n \"slug\": \"前瞻记忆\"\n },\n {\n \"depth\": 3,\n \"title\": \"未来记忆\",\n \"slug\": \"未来记忆\"\n },\n {\n \"depth\": 3,\n \"title\": \"提醒的两个层面：\",\n \"slug\": \"提醒的两个层面\"\n },\n {\n \"depth\": 2,\n \"title\": \"6.外界知识和头脑中知识的此消彼长\",\n \"slug\": \"6外界知识和头脑中知识的此消彼长\"\n },\n {\n \"depth\": 3,\n \"title\": \"外界的知识\",\n \"slug\": \"外界的知识\"\n },\n {\n \"depth\": 3,\n \"title\": \"头脑中的知识\",\n \"slug\": \"头脑中的知识\"\n },\n {\n \"depth\": 2,\n \"title\": \"7.多个大脑里和多个设备中的记忆\",\n \"slug\": \"7多个大脑里和多个设备中的记忆\"\n },\n {\n \"depth\": 2,\n \"title\": \"8.自然映射\",\n \"slug\": \"8自然映射\"\n },\n {\n \"depth\": 3,\n \"title\": \"什么是自然映射\",\n \"slug\": \"什么是自然映射\"\n },\n {\n \"depth\": 3,\n \"title\": \"三个层次的映射\",\n \"slug\": \"三个层次的映射\"\n },\n {\n \"depth\": 3,\n \"title\": \"糟糕的映射 VS 好的映射\",\n \"slug\": \"糟糕的映射-vs-好的映射\"\n },\n {\n \"depth\": 2,\n \"title\": \"9.文化与设计：自然映射随文化而异\",\n \"slug\": \"9文化与设计自然映射随文化而异\"\n }\n ],\n \"updated\": \"2022-08-06T10:50:14.322Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"日常行为心理学\",\n \"tags\": [\n \"设计心理学1\",\n \"读书笔记\"\n ],\n \"categories\": [\n \"设计心理学\"\n ],\n \"keywords\": [\n \"设计心理学\"\n ],\n \"draft\": false,\n \"created\": \"2021-10-20T16:14:47.371Z\",\n \"summary\": \"《设计心理学 1》第二章——人们如何做事？当事情出错了怎么办？怎么知道要做什么？\",\n \"lastmod\": \"2022-04-16T12:55:05.400Z\",\n \"slug\": \"/设计心理学1-2.md\",\n \"path\": \"/设计心理学1-2\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"1.人们如何做事：执行与评估的鸿沟\",\n \"slug\": \"1人们如何做事执行与评估的鸿沟\"\n },\n {\n \"depth\": 3,\n \"title\": \"执行的鸿沟：\",\n \"slug\": \"执行的鸿沟\"\n },\n {\n \"depth\": 3,\n \"title\": \"评估的鸿沟：\",\n \"slug\": \"评估的鸿沟\"\n },\n {\n \"depth\": 3,\n \"title\": \"如何消除这两个心理鸿沟：\",\n \"slug\": \"如何消除这两个心理鸿沟\"\n },\n {\n \"depth\": 2,\n \"title\": \"2.行动的七个阶段\",\n \"slug\": \"2行动的七个阶段\"\n },\n {\n \"depth\": 3,\n \"title\": \"行动的两个步骤\",\n \"slug\": \"行动的两个步骤\"\n },\n {\n \"depth\": 3,\n \"title\": \"七个阶段：\",\n \"slug\": \"七个阶段\"\n },\n {\n \"depth\": 4,\n \"title\": \"执行桥 （目标->外部世界）\",\n \"slug\": \"执行桥-目标-外部世界\"\n },\n {\n \"depth\": 4,\n \"title\": \"评估桥（外部世界->目标）\",\n \"slug\": \"评估桥外部世界-目标\"\n },\n {\n \"depth\": 3,\n \"title\": \"行动的分类：\",\n \"slug\": \"行动的分类\"\n },\n {\n \"depth\": 3,\n \"title\": \"“根本原因分析”\",\n \"slug\": \"根本原因分析\"\n },\n {\n \"depth\": 2,\n \"title\": \"3.人的思想：潜意识主导\",\n \"slug\": \"3人的思想潜意识主导\"\n },\n {\n \"depth\": 3,\n \"title\": \"潜意识\",\n \"slug\": \"潜意识\"\n },\n {\n \"depth\": 3,\n \"title\": \"有意识的思维\",\n \"slug\": \"有意识的思维\"\n },\n {\n \"depth\": 3,\n \"title\": \"认知和情感\",\n \"slug\": \"认知和情感\"\n },\n {\n \"depth\": 2,\n \"title\": \"4.人的认知和情感\",\n \"slug\": \"4人的认知和情感\"\n },\n {\n \"depth\": 3,\n \"title\": \"本能层\",\n \"slug\": \"本能层\"\n },\n {\n \"depth\": 3,\n \"title\": \"行为层\",\n \"slug\": \"行为层\"\n },\n {\n \"depth\": 3,\n \"title\": \"反思层\",\n \"slug\": \"反思层\"\n },\n {\n \"depth\": 2,\n \"title\": \"5.行动的七个阶段和大脑的三个层次\",\n \"slug\": \"5行动的七个阶段和大脑的三个层次\"\n },\n {\n \"depth\": 3,\n \"title\": \"心流\",\n \"slug\": \"心流\"\n },\n {\n \"depth\": 2,\n \"title\": \"6.自说自话\",\n \"slug\": \"6自说自话\"\n },\n {\n \"depth\": 3,\n \"title\": \"概念模式\",\n \"slug\": \"概念模式\"\n },\n {\n \"depth\": 2,\n \"title\": \"7.责备错误之事\",\n \"slug\": \"7责备错误之事\"\n },\n {\n \"depth\": 3,\n \"title\": \"给用户有保留的预测：\",\n \"slug\": \"给用户有保留的预测\"\n },\n {\n \"depth\": 3,\n \"title\": \"习得性无助（自责循环）\",\n \"slug\": \"习得性无助自责循环\"\n },\n {\n \"depth\": 3,\n \"title\": \"积极心理学\",\n \"slug\": \"积极心理学\"\n },\n {\n \"depth\": 3,\n \"title\": \"tips：\",\n \"slug\": \"tips\"\n },\n {\n \"depth\": 2,\n \"title\": \"8.不当的自责\",\n \"slug\": \"8不当的自责\"\n },\n {\n \"depth\": 3,\n \"title\": \"自责的原因\",\n \"slug\": \"自责的原因\"\n },\n {\n \"depth\": 3,\n \"title\": \"设计师应如何\",\n \"slug\": \"设计师应如何\"\n },\n {\n \"depth\": 2,\n \"title\": \"9.行动的七个阶段：七个基本设计原则\",\n \"slug\": \"9行动的七个阶段七个基本设计原则\"\n },\n {\n \"depth\": 3,\n \"title\": \"前馈\",\n \"slug\": \"前馈\"\n },\n {\n \"depth\": 3,\n \"title\": \"反馈\",\n \"slug\": \"反馈\"\n },\n {\n \"depth\": 3,\n \"title\": \"设计的七个基本原则\",\n \"slug\": \"设计的七个基本原则\"\n }\n ],\n \"updated\": \"2022-08-06T10:50:15.315Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"日用品心理学\",\n \"tags\": [\n \"设计心理学1\",\n \"读书笔记\"\n ],\n \"categories\": [\n \"设计心理学\"\n ],\n \"keywords\": [\n \"设计心理学\"\n ],\n \"created\": \"2021-10-20T12:28:00.000Z\",\n \"summary\": \"《设计心理学 1》第一章——好设计有两个特征可视性和易通性\",\n \"lastmod\": \"2022-04-16T12:55:08.323Z\",\n \"slug\": \"/设计心理学1-1.md\",\n \"path\": \"/设计心理学1-1\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"1.复杂的现代设备\",\n \"slug\": \"1复杂的现代设备\"\n },\n {\n \"depth\": 2,\n \"title\": \"2.以人为本的设计\",\n \"slug\": \"2以人为本的设计\"\n },\n {\n \"depth\": 2,\n \"title\": \"3.交互设计的基本原则\",\n \"slug\": \"3交互设计的基本原则\"\n },\n {\n \"depth\": 3,\n \"title\": \"示能\",\n \"slug\": \"示能\"\n },\n {\n \"depth\": 3,\n \"title\": \"意符\",\n \"slug\": \"意符\"\n },\n {\n \"depth\": 3,\n \"title\": \"约束\",\n \"slug\": \"约束\"\n },\n {\n \"depth\": 3,\n \"title\": \"映射\",\n \"slug\": \"映射\"\n },\n {\n \"depth\": 3,\n \"title\": \"反馈\",\n \"slug\": \"反馈\"\n },\n {\n \"depth\": 2,\n \"title\": \"4.系统映像\",\n \"slug\": \"4系统映像\"\n },\n {\n \"depth\": 2,\n \"title\": \"5.科技的悖论\",\n \"slug\": \"5科技的悖论\"\n },\n {\n \"depth\": 2,\n \"title\": \"6.设计的挑战\",\n \"slug\": \"6设计的挑战\"\n }\n ],\n \"updated\": \"2022-08-06T10:50:16.843Z\",\n \"type\": \"article\",\n \"html\": \"\"\n },\n {\n \"title\": \"什么是设计洞察 · What is Insight\",\n \"created\": \"2021-10-15T15:07:14.533Z\",\n \"tags\": [\n \"Design Thinking\",\n \"翻译\"\n ],\n \"keywords\": [\n \"insight\"\n ],\n \"slug\": \"/insight.md\",\n \"path\": \"/insight\",\n \"toc\": [\n {\n \"depth\": 2,\n \"title\": \"insight 不是什么\",\n \"slug\": \"insight-不是什么\"\n },\n {\n \"depth\": 2,\n \"title\": \"是什么\",\n \"slug\": \"是什么\"\n },\n {\n \"depth\": 2,\n \"title\": \"五大要素\",\n \"slug\": \"五大要素\"\n },\n {\n \"depth\": 2,\n \"title\": \"定义 Insight 的步骤\",\n \"slug\": \"定义-insight-的步骤\"\n },\n {\n \"depth\": 3,\n \"title\": \"1.设定语境/场景\",\n \"slug\": \"1设定语境场景\"\n },\n {\n \"depth\": 3,\n \"title\": \"2.沟通困境\",\n \"slug\": \"2沟通困境\"\n },\n {\n \"depth\": 3,\n \"title\": \"3. 阐明原因\",\n \"slug\": \"3-阐明原因\"\n },\n {\n \"depth\": 3,\n \"title\": \"4. 捕捉动机\",\n \"slug\": \"4-捕捉动机\"\n },\n {\n \"depth\": 3,\n \"title\": \"5.构想理想\",\n \"slug\": \"5构想理想\"\n },\n {\n \"depth\": 2,\n \"title\": \"如何表达\",\n \"slug\": \"如何表达\"\n },\n {\n \"depth\": 3,\n \"title\": \"第一句话——描述现状和用户行为。\",\n \"slug\": \"第一句话描述现状和用户行为\"\n },\n {\n \"depth\": 3,\n \"title\": \"第二句话——描述用户的困境，并说明造成困境的原因。\",\n \"slug\": \"第二句话描述用户的困境并说明造成困境的原因\"\n },\n {\n \"depth\": 3,\n \"title\": \"第三句话——描述用户期望的最终理想状况。\",\n \"slug\": \"第三句话描述用户期望的最终理想状况\"\n },\n {\n \"depth\": 3,\n \"title\": \"Tips\",\n \"slug\": \"tips\"\n },\n {\n \"depth\": 2,\n \"title\": \"什么是一个好的’Insight’\",\n \"slug\": \"什么是一个好的insight\"\n },\n {\n \"depth\": 2,\n \"title\": \"Insight->How Might We?\",\n \"slug\": \"insight-how-might-we\"\n },\n {\n \"depth\": 2,\n \"title\": \"后记\",\n \"slug\": \"后记\"\n }\n ],\n \"updated\": \"2022-08-06T10:49:42.689Z\",\n \"type\": \"article\",\n \"html\": \"\"\n }\n]"}</script>
|
||
</body>
|
||
</html>
|