Because of the epidemic, I have not been to the cinema for a whole year, and I have watched only a handful of films on the projector at home. But there is one, fully watched twice – “super body”. This is a 14-year sci-fi action movie, she strayed into the Mafia, forced to sewn into the womb of high concentration refining CPH4 (pregnant women produce trace elements can help the fetus forming bone) drug smuggling, because is in the process of transportation, medicine broke into her blood, since then, her brain was developed step by step, finally reached 100%…

Lucy

What attracted me to see it again and again was the film’s philosophy. She gradually realized that the development of the brain, is a super ability, is also a super power, his body is only a container, the container itself is not enough to support such a big super energy, genetic instinct for survival, will drive cell independently to find suitable soil – continue to learn through ancient and modern humans, the earth and the universe of all information, in the end, she body disappear, Turn into a super computer carrier USB disk, leaving a sentence “I am everywhere” ~~89 minutes, narrative in one go — all living creatures are machines created by genes, life is short, genes are immortal.

100% brain development, encounter with ancestors

From the movies back to reality, human beings are actually doing infinite unconscious behaviors driven by genes in their limited lives. We may seem powerful and at the top of the food chain, but we often fail to distinguish between what we want and what we want. When people think about such a huge theory of knowledge, they may only get a quick answer: physics ends in mathematics, mathematics ends in philosophy, and philosophy ends in theology.

So, since we can’t fight genes, we have to go with them; Within our ability to stay awake and consciously make behavioral decisions that will make us happier, allowing us to experience more pleasure and satisfaction in our short physical lives.

So, what is happiness?

‘Happiness is the state of being able to define your values and really realize them,’ Mr. Yanagi said. Success is to make people who have the same values feel you are happy. Success is an extension of happiness.

People who work even eight hours a day (and more in the Internet industry) spend at least a third of their time at work. If your job happens to be small program development, the formula for happiness for 1/3 of your life is:

  1. Values = Desire to develop applets efficiently
  2. Realization value = auxiliary tool coefficient ✖️ (output ✖️ quality)/time

Smart UI was designed and developed to improve accessibility.

What is Smart UI

Smart Applet THE Smart UI Extension component library, and its derivative sample template library, is an expansion of the basic capabilities of small programs, including more diverse capabilities and composition styles, currently supports 33 components (Component list), and precipitated 14 sets of combination capability sample templates (The template list).

It is disassembled according to atomic theory, and like building blocks, single building blocks are combined to form a kaleidoscopic small program entity. Developers are free to choose whether to customize the blank by themselves or directly live in our hardcover room.

But in any case, the hard work of moving bricks, laying foundations and scraping cement has been done by Smart UI.

Atomic theory

Visual aided programming

While exploring the benefits of small program development, we realized that visual aided programming was a well-balanced way to improve performance by lowering the barriers to language learning while preserving the flexibility of developers to develop their own.

Therefore, we chose the developer tool GUI assist programming as the key assist factor mentioned above.

The use of Smart UI components, first, supports the most general NPM introductions:

1) The first step is to install the dependency package @smT-UI/Component in the project;

npm i @smt-ui/component
Copy the code

2) Introduce custom components in the NPM package

{
    "usingComponents": {
        "smt-icon": "@smt-ui/component/src/icon"
    }
}
Copy the code

3) Directly use this component in swan of the corresponding page

<smt-icon name="arrow-left"></smt-icon>
Copy the code

At the same time, it also supports visual aided programming with developer tools panel:

1) Open the developer tool and display the editor interface

2) Click on the upper right corner of the editor to open the components panel


3) Select the Smart UI panel to view the Smart UI component list


4) Select the component on the panel and click Insert to insert the component into the current.swan file. The effect can also be viewed in the simulator



Similarly, for the combination capability example, we also provide two similar uses as above.

  1. Imported via NPM installation

1) Run the following command in the root directory of the applet to download the corresponding NPM package of the page template

NPM i@smT-UI-template /page-status // Template nameCopy the code

2) Copy the corresponding template file to a suitable directory (such as Pages) of the current applet. The template file is @SMT-UI-template-xxx file in the NPM package

├─ project.swan. Json ├─ app.js ├─ pages ├─ @smt-uI-template-status // ├─ project.swan. Json ├─ app.js ├─ pages ├─ @smt-uI-template-status //Copy the code

3) Configure the path path of the template page in app.json in the root directory of the applet and check the effect

{
    "pages": [
        ...
        "pages/@smt-ui-template-status/index"
        ...
    ]
}
Copy the code

2. Visual assistant programming, developer tools welcome page panel

Open the Developer tool, click “Page Template”, select the corresponding template, click “Use it now” in the lower right corner, fill in the relevant information and click “Finish” in the lower right corner.

Rich icon library

Small program project in daily practice, designers will ever precipitation of 284 icon to optimize details and make it more in the application of accuracy, diversity and abundance, and encapsulated into SVG format to export, as a set of can really for developers to use Smart UI icon library (icon components use way to see the documentation for details).

Lightweight chart

When we meet some data and report requirements, the cost of drawing by ourselves is very high, so we tend to look for some third-party chart libraries. Smart UI provides a small program chart component that can be quickly accessed using flat data configuration. It is light in size and meets the requirements of regular line charts, bar charts, and pie charts. It supports SVG + Canvas rendering engines. (For details about how to use the CLFE-Chart component, see the documentation).

Information flow card component

If the applets themselves are content-class components, then the information flow is indispensable.

Smart UI provides a variety of modes of information flow card components, designed by small program UE professional team, in line with the information flow design specifications; Including left and right image, plain text, above picture, multi image and video and other modes. (See the documentation for how to use the feed-item component.)


Focus on the boot mask component

In order to help small program developers to better retain users and continue to interact with users in the future, intelligent small program officially launched a small program focus component, and focus on the guide layer component, can guide users to focus on small programs.

Mask component, can guide users to pay attention to small programs with one key, improve the user stickiness of small programs; Both default top navigation and custom navigation are supported. (For details about how to use the Mask component, see the documentation)

Of course, a masked boot can focus the user’s attention on the boot, so that the original page functions can not be used; Considering that it will interrupt the user’s task path and immersive experience, we recommend that it be used with caution and be shown once when the user enters the home page of the mini program for the first time.

Field applets

Vindicates the trickster small program, the application of Smart UI component library in the custom navigation and pull down to refresh, complete the home template waterfall flow. (the source address: https://github.com/wannamakeudance/swan-artifact)

preview

Example Template

For a new contact with small program development students, learning the document is the first step, but the API of the document, component content is complete and huge, each learn to develop small program, will be a relatively long process.

At this point, if there are some off-the-shelf applets templates, developers can greatly reduce the cost of learning in the process of secondary development. Smart UI components combined with the daily business of applets have accumulated a combination of capabilities to solve this pain point.

Below are examples of graphic and text details page and template effect of processing service (multi-process). More templates, can view the https://smartprogram.baidu.com/docs/develop/example/template/templatelist/ website document

This is what I want to share with you. I hope that Smart UI can be used as an auxiliary factor greater than 1 to improve the happiness of small program developers by 1/3 of the time.