Skip to content

演练和UI样机-Walkthroughs and UI Mockups

ARCHIVED

！注意“归档” 

This chapter has not been updated for the current version of Orchard, and has been ARCHIVED.

Orchard Branding

果园品牌

  • Branding svg

  • [Branding svg]（https://raw.githubusercontent.com/OrchardCMS/OrchardDoc/master/docs/Walkthroughs/branding/orchard-logo.svg） *

  • Branding vectors

  • [品牌向量]（../演练/品牌/ OrchardLogo1.png） *

  • Branding PSD

  • [品牌PSD]（../演练/品牌/ OrchardLogo2.png） *

  • Adobe Illustrator logo sources

  • [Adobe Illustrator徽标来源]（../附件/演练/ OrchardLogos.zip） *

Wireframes

线框

Click on the walkthrough title to download a zip file containing the numbered images.

单击演练标题以下载包含编号图像的zip文件。

  • Blog

  • [博客页]（../演练/ Blog.zip） *

  • Comments

  • [注释]（../演练/ Comments.zip） *

  • Media Management

  • [媒体管理]（../演练/ Media.zip） *

  • Pages

  • [页]（../演练/ Pages.zip） *

  • Roles and Permissions

  • [角色和权限]（../演练/角色和权限.zip） *

  • Themes

  • [主题]（../演练/ Themes.zip） *

Themes

主题

Photoshop and HTML front-end theme mockups.

Photoshop和HTML前端主题模型。

  • Classic Theme - html

  • [经典主题 - HTML]（../演练/主题/时间/默认情况下） *

  • Green Theme - html

  • [绿色主题 - HTML]（../演练/主题/绿色/ default.html） *

  • Dark Theme - not implemented

  • [黑暗主题]（../ Walkthroughs / themes / night.png） - 未实现 *

  • Brown Theme - not implemented

  • [布朗主题]（../演练/主题/ hotChocolate.png） - 未实现 *

Admin UI

管理员界面

Below are some of the more recent admin designs.

以下是一些最近的管理设计。

  • Light Admin Theme

  • [轻型管理主题]（../演练/ AdminDesign / Admin_light.png） *

  • Dark Admin Theme

  • [黑暗管理主题]（../演练/ AdminDesign / Admin_dark.png） *

  • List of posts

  • [帖子列表]（../演练/ AdminDesign / PostList_a_020610.png） *

  • Manage users rev 1

  • [管理用户rev 1]（../演练/ AdminDesign / ManageUsers.png） *

  • Manage users rev 2

  • [管理用户第2版]（../演练/ AdminDesign / ManageUsers_2.png） *

Admin UI - Original

管理界面 - 原创

Below are some of the original admin designs. These show how the design progressed from something that was strongly branded Orchard to a more generic design.

以下是一些原始的管理设计。这些展示了设计如何从强烈品牌Orchard的设计发展到更通用的设计。

  • Manage blogs

  • [管理博客]（../演练/ AdminDesignArchive / BlogList_012910.png） *

  • Manage pages

  • [管理页面]（../演练/ AdminDesignArchive / PagesList_020110.png） *

  • List of posts

  • [帖子列表]（../演练/ AdminDesignArchive / PostList_c_012910.png） *

  • Zip of admin designs

  • [管理员设计的邮编]（../演练/ AdminDesignArchive / AdminDesigns.zip） *

Design Concepts & Ideas

设计概念＆amp;思路

These designs and mocks are not related to work we are currently developing.

这些设计和模拟与我们目前正在开发的工作无关。

Wireframes:

线框：

PhotoShop mocks:

PhotoShop嘲笑：

JavaScript & html Mocks

JavaScript＆amp; html嘲笑

  • Context publish buttons

  • [上下文发布按钮]（../ Walkthroughs / html_jsMocks / inContext / inContext.html） *

  • Context TinyMCE

  • [Context TinyMCE]（../ Walkthroughs / html_jsMocks / inContext / inContext2.html） *

  • View switcher

  • [查看切换器]（../ Walkthroughs / html_jsMocks / viewSwitcher / viewSwitcher.html） *

  • Admin buttons

  • [管理员按钮]（../演练/ html_jsMocks / Pagination.html） *

We use the Balsamiq Mockups tool to create these walkthroughs.

我们使用[Balsamiq Mockups]（http://www.balsamiq.com/products/mockups）工具来创建这些演练。