Body text:
In 1992, the famous American science fiction writer Neo Stevenson wrote Avalanche, which describes a network world parallel to the real world - the Metaverse. In 2021, with the launch of Roblox, the meta-universe became one of the hottest concepts in technology. All of a sudden, both entrepreneurs and capital markets are concerned about the metaverse. It can be said that human's deeper desire for the real world has opened the door to the virtual world and the real world, AR and VR technology is developing at a high speed, perhaps soon, in the near future, we are all in the immersive experience of "Number One Player", I do not know whether it is worth looking forward to.
![](/uploads/images/20240201/8b4ff78dc4ba1daed0a5f8e4fce69a6665bb38cea8d78.png)
The high-end technology mastered by the giant leads the development of the industry, from 2021 to now, with the concept of meta-universe popular, we have undertaken a lot of meta-universe + related projects, AR, VR, intelligent software, intelligent hardware, here, we use the gold 15' to share and communicate together.
一、Three thoughts
The core thinking of building a website from top to bottom allows enterprises to maximize the benefits of the display of Internet platforms.
|
1. Temporal thinking
The time that the user finds the enterprise website on the Internet, the time that the user stays on the web page, the useful information of the user is transmitted in a limited time, and the user transformation is achieved after a certain time.
|
When watching "Number one Player", wow, put on the glasses, put on the skin, take the handle, drop into another world, we are based on the first impression of the meta-universe + to the user, the pre-emptive technology, commercial capital needs the strength of the enterprise to draw up "eye-catching" is the most priority word in this industry. And "experience" is the most important word in this business.
![](/uploads/images/20240201/1bb9e86d05da96697bbf0f0218fc8c5c65bb38ce9fbfd.png)
In the production of such projects, we seize these two keywords, combined with the enterprise's own product planning, starting from the open screen animation, we need to attract attention, using static scene + dynamic space + interactive experience to build a website that can let users issue "wow" within 15'.
![](/uploads/images/20240201/1d3e6ea0ff275d1bea678b1a9eac64f465bb38cea61c8.png)
2. Brand thinking
Around the enterprise brand promotion and operation as the core, create brand memory points, express the professionalism of the industry through professional design, and achieve high transformation of the brand website.
|
Every brand enterprise should have its own brand tonality, product tonality, Roblox, Facebook (Meta), Microsoft, Tencent, ByteDance acquired Pico, we listen to these terms, there is a brand impression, with the popularity of the concept of "meta universe", Brands began to pay attention to the marketing opportunities brought about by changes in consumer experience, including NIKE, GUCCI, VANS, COCACOLA, etc., have established a brand meta universe theme world with the meta Universe space, taking brand culture as the theme, to provide users with immersive interactive experience.
![](/uploads/images/20240201/8808df77fd5015dd8f03cc36cc7d30d665bb38ceaecd4.png)
At present, the most vigorous development of the metaverse industry is closer to the entertainment, social scene, content producers and intelligent hardware companies will become the main cash in this period. Under the requirements of the meta-universe marketing ecosystem, brands need to be able to create experiences that meet the characteristics of the meta-universe, and build their own "digital economy" according to the three major contents of the meta-universe ecological marketing: people, goods, and fields (users, products, and scenes). We plan our website content according to the direction of brand marketing, and its focus can be technology or the scene of the meta universe landing or the hot marketing of the meta universe.
![](/uploads/images/20240201/b6eabf16a62d6888bb48d436d47c280d65bb38ceba738.png)
From the starting point of brand marketing, combined with the market environment where marketing is located, we can accurately draw the general direction of web design, so as to control the user's foothold after entering the website.
For example, the virtual reality technology of the meta-universe, the carrier is VR glasses, the enterprise is to buy glasses as the core, or highlight the technology as the core, which plays an indispensable reference role in our website planning and logical experience. Combined with the purpose of the brand on the Internet, through vision, reach the target user group, so as to produce the first impression of the user on the brand, is very cool VR glasses, or very high-end cutting-edge technology, or it is one.
Of course, for the different tob and toc market environment, high-end cutting-edge technology is ultimately to attract investors, talents, and cool VR glasses are more consumers. So brand positioning and the future development direction of the brand, will affect the design of the website, of course, some people will say that you are not a help us do the website? No, we're your branding department, Marketing Department, media department, that's why we make the website and you feel like we're part of the party.
![](/uploads/images/20240201/cce8683f4c94138c5e9122773ecb36f765bb38cfa6b65.png)
3. Business thinking
We need to cope with the rapid change of the environment, website content synchronization even needs to be ahead of the development of the enterprise, website planning will be combined with the comprehensive consideration of the current and future development of the enterprise, through the precipitation on the Internet, to obtain enough data, to analyze user behavior habits and preferences, to iterate the website and even iterate the product, so as to obtain continuous transformation.
|
In March 2022, the "2022 Meta-Universe Industry Development Trend Report" launched by Sutu Meta-Universe Research Institute proposed that from the second half of 2022 to 2024, with the definition and supervision of the meta-universe industry gradually in place, the boundary of the meta-universe began to be clear, and the industry's enthusiasm for the meta-universe will begin to return to rationality, with the increase of the entry threshold. Small businesses began to be acquired by giants, and some enterprises with weak competitiveness and pseudo-metaverse concepts began to leave the field.
With the development of the underlying technology of the meta-universe, the infrastructure construction of the meta-universe will begin to enter a period of comprehensive acceleration, and the upgrading of key technologies will become the key to breaking the development bottleneck of the meta-universe. At the same time, digital technology is a big engine to promote the "double integration" of the digital economy and the real economy.
Sutu Meta-Universe Research Institute puts forward that human society and meta-universe will exist for a long time in the mode of "meta-universe +". Through the instrumentalization of the meta-universe, it will become an important starting point to promote the efficiency of various industries to a new height after the Internet. If you want to reach the ultimate form of metaverse development, it is inevitable to integrate with other industries and achieve scene landing by enabling "symbiosis". Taking artificial intelligence technology as an example, it can not only become the infrastructure to promote the development of new medicine, new materials and new energy, but also become a new productivity for the digital transformation of all walks of life, which is a typical "cross-circle productivity".
So in such a big environment, the design core of our meta-universe + website is actually very clear, in the symbiotic meta-universe + model, our core highlight is our technology, and our derived industrial applications.
To master the three core keywords of traffic, transformation and operation, from the meta-universe of hot search to the actual product of landing, we need to improve the accuracy of user traffic, make users curious, impression and memory points through vision, and extend the user's stay on the website, so as to accept more website information, which is what we need to consider. Using a strong meta atmosphere to design user attention points, how to combine specific landing products to generate user conversion is our website design needs to consider.
![](/uploads/images/20240201/62359a5a38e5d570652ad7fe6977b18f65bb38cfc213e.png)
二、Gold 15 seconds landing plan
Time thinking - how fast and slow the user lands, long and short
Brand thinking - logic and blocks around the core content
Business thinking - quantitative feedback and iteration
|
1. Metacosmic symbiosis website features
For example, digital products such as VR glasses and solutions such as digital technology that we most often cooperate with have certain commonalities in website needs.
Mainly in the following four aspects:
Pay attention to visual display effect
The image of digital products is physical or non-physical, which has higher requirements for the expression of content.
Emphasize brand strength to win trust
We hope to reflect innovation and industry-leading through data, talent scale and cooperation scale.
Focus on technology and solutions
Digital landing, through the actual product or use of the scene.
Differentiated experience
Have a good experience from the dynamic and interactive content of the open screen.
2. Website design steps
2.1 Demand analysis
Project background
Combined with the services provided by the enterprise: VR glasses, VR technology, 360° space, software solutions, games, integrated platforms, electronic products, metauniverse conference, metauniverse digital land assets...
Competitive product research
Competitive product research in the industry is not to imitate, but mainly to understand the habits of the industry and users. Whether it is aesthetic or business division, we cannot break away from the commonness of the industry and user habits to do unrestrained innovation. For example, our meta-universe symbiosis industry is a digital innovation/technology/dynamic design style. It is necessary to do some conceptual design on the concept of core technology, and it is obviously inappropriate to refer to the rigorous style of the medical industry. The research of competitive products can be carried out from the three aspects of design style, content structure and website marketing ability to find out the common points of the industry, avoid the existing problems of each other's websites and their own websites, and surpass and achieve industry leadership.
|
Corporate positioning/expectations
Giant industries, innovative enterprises...
Target group analysis
![](/uploads/images/20240201/2b29137b3fa4cadc82c0d67d5c64c2d465bb38cfac2a1.png)
Website purpose
Short term promotion/medium term empowerment/long term precipitation
The website needs to convey the appeal
Technology, leadership, cutting-edge, investment...
2.2 Website content arrangement and column planning
In the section planning of such enterprises, visual display is the primary position, combined with our most basic logical structure of the website section, from the first screen of the website needs to give information with brand tonality.
![](/uploads/images/20240201/441cc59a5f41a4cf53108dc0563a7ff465bb38cf98e2f.png)
![](/uploads/images/20240201/0c7c57b505a26f87903935e51398c34b65bb38cfa993d.png)
![](/uploads/images/20240201/dd8c0ea3d015372a77ecc55052143c9e65bb38cfdf3ef.png)
2.3 Design key words
We hold brainstorming sessions that can be refuted in real time (Note 1) :
Take a VR glasses company as an example
Product itself, future expectations, brand tonality, virtual reality, panoramic display, immersive experience, space, visual aberration, product explosion, product disassembly, black, blue, particle effect,
We can derive a lot of keywords about VR glasses (these keywords are required, see note 1), gray for the brainstorming was "attacked" dropped, yellow for the second "attack" dropped, and finally we can integrate 5 target words as the design basis and creative distribution starting point of the project:
Spatial sense, 3D rotation, black, premium, experience
A "mental model" of such users:
Experiences, senses, memory points, social sharing, future consumers (potential customers, current stage watchers)
2.4 Crazy inspiration
Our design is never hard work, website design needs commercial, business needs market verification, we will collect a large number of references to quickly get inspired, follow a few principles to find inspiration, according to our above determined "positioning" "target word" "mental model" based on the following massive steps:
① Collect; ② Extraction; (is input, output); Repeat 1 and 2
Many clients will waste time in countless trials and agonies, feeling that nothing needs to be changed, but it just needs to be changed. Minimalist Mufeng design inspiration is not less than the customer, I believe we will choose the most appropriate display method.
|
![](/uploads/images/20240201/41677047a9206e6edb4195ace8e5af0665bb38d07dbc8.png)
2.5 Exquisite layout and color scheme
Combined with the complete Vi manual, apply to the web page or adjust the color scheme of the web application, with the industry tone and brand vision system as the starting point, design our colors.
![](/uploads/images/20240201/82090dcb98725549eb5ab503e3ed4a1365bb38d065e3f.png)
![](/uploads/images/20240201/54bd779cd346015c2e61c7c279f3828565bb38d094658.png)
2.6 Prototype validation and renderings
Prototype is an important step of planning landing and user experience combing, through the prototype can quickly plan the content of the page, the relationship between the website pages, simulate the user journey. It should be noted that all planning should be based on the real content that can be provided, and the prototype must be the content that can be landed, so as to ensure the consistency of subsequent implementation.
![](/uploads/images/20240201/cc9dbce71ec45ccfd22b2a36e291e42c65bb38d070a6b.png)
三、 Appreciation of excellent cases of PithyMf
Lumicore
Dot space increment, interactive visual poor, data dynamic font
https://lumicore.com/
![](/uploads/images/20240201/11447bc36c937c70596ead695c6a84e365bb38d0a32fa.png)
Tg
Poor vision clouds, buildings; Dynamic altitude, real-time temperature;
The viewer (scope) is designed to make the user feel as if they are really looking at another world.
http://tg.mfweb.club/
![](/uploads/images/20240201/17597a755edf002123a492154d4d755565bb38d11f009.png)
Ivisionic
How to use simple and clean geometry to express the combination of ultra-low delay and high-precision positioning, see the case below
https://www.ivisionic.com/
![](/uploads/images/20240201/9787d70574d372bf166c4ce8c1abe4ca65bb38d567321.png)
Maxtropy
Video open screen; 3D modeling combined with trigger dynamics;
https://maxtropy.com/
![](/uploads/images/20240201/ec6763eb4360c34afdd0a6d9c400140a65bb38d56ee8c.png)
Auodigitecg
Uniform AUO Group visual specifications;
The current static 3D and dynamic content sections emphasize the content, while the three-dimensional dynamics of 3D color blocks alone emphasize the visual unity of AUO Group;
https://www.auodigitech.com/zh-CN/
![](/uploads/images/20240201/305d55a7f51c835e096aed94c9101a0565bb38de547ed.png)
四、Inspiration sharing
We have collected more than 22 high-quality meta-universe + websites, including VR glasses, electronic products and other digital products, digital technology and other solutions, 360° space and other scene display, brand game marketing, meta-universe conference conference, meta-universe digital land assets and other virtual scene applications, each of which has its own highlights.
BEAR 71VR
Virtual world real operation
https://bear71vr.nfb.ca/
![](/uploads/images/20240201/827ce84b791450ebd47764ad947382f965bb38d4f372b.png)
Dpt
AR visual enhancement technology
https://dpt.co/en/
![](/uploads/images/20240201/f52e0bf6ca4376fc0e8b3323e872555465bb38d6cb343.png)
Blobmixer
3D dynamic
https://blobmixer.14islands.com/
![](/uploads/images/20240201/5af6d1f54822b4dfb8fe89d91ef2011c65bb38d50ed58.png)
Microsoft Data Center
3D modeling
Trigger interaction
https://news.microsoft.com/stories/microsoft-datacenter-tour/
![](/uploads/images/20240201/39493056a8515708b79350d1976e17b365bb38ddb388e.png)
![](/uploads/images/20240201/b1122ce7723aa4ab1f9ae5c9e457299e65bb38e117b1b.png)
OSSOVR
Medical science
https://www.ossovr.com/
![](/uploads/images/20240201/1de5ee227194f6d8c7fb9fb0e76160f265bb38d7eb252.png)
OWN VR
3D dynamic trigger rotation
https://osirisvr.webflow.io/
![](/uploads/images/20240201/ded4da73f41ff0ba3ad23dcb1c01c61965bb38d6b6031.png)
TRIVVER
Open screen virtual space video display
https://www.trivver.com/
![](/uploads/images/20240201/5c1489ecb12aab4644fe4825daecc9bf65bb38df3f835.png)
Museudastoninhas
Panoramic pavilion experience
https://museudastoninhas.com.br/o-museu-virtual/
![](/uploads/images/20240201/94f07912df70d1473037ed6dad3463c765bb38d8b9a76.png)
![](/uploads/images/20240201/474f2f8fec68b8f4740bb845dd1be7a365bb38db6be61.png)
COUNTER-DESIGN
Exhibition hall immersive experience
https://counter-design.digital/
![](/uploads/images/20240201/1724d7b0e0ead65afb76e8ab244bd5d465bb38df2b683.png)
Fis - VR空间设计
Simple, straightforward, fixed click experience
https://www.fisaboldfuture.com/
![](/uploads/images/20240201/42ce0ef43f519f6d75b209d84d4d24b365bb38deb4dfd.png)
ROCKET LAB
https://www.rocketlabusa.com/
![](/uploads/images/20240201/5214deb7c6289366627c48053972285a65bb38e0aec2a.png)
OddBot
https://oddbot.oddcommon.com/
![](/uploads/images/20240201/f75d70073037119efac45cb01d4f2e3d65bb38df21248.png)
VR for Work
https://www.vrfor.work/
![](/uploads/images/20240201/274f33e485200fdaf6a7d478c9ae712b65bb38e3226af.png)
SILVERSTREAM TECHNOLOGIES
https://www.silverstream-tech.com/
![](/uploads/images/20240201/c553387492f2f6c05da9bd5702f7ec5165bb38e32fcea.png)
PIAGET: POLO EXPERIENCE
http://polo-experience.piaget.com/video/360
![](/uploads/images/20240201/2c0e2d7101fe1489c4303aeab0e823aa65bb38e33684c.png)
EXXONMOBIL CARBON CAPTURE
https://ccs-ar.exxonmobil.com/
![](/uploads/images/20240201/2ff4afe1c096a54dceafb74fbbea1dea65bb38e336bbf.png)
Motley Peers
https://www.motleypeers.com/projects
![](/uploads/images/20240201/53b800253b5c3b0b8a552241ea415b0e65bb38e33c190.png)
Are you okok?
https://areyou.okok.services/
![](/uploads/images/20240201/e99ce244dea53f073a90fd72a7d64c0e65bb38e327397.png)
MicroWaver
https://microwaver59.com/
![](/uploads/images/20240201/7b96520f3925e30d652e9a8490881c4065bb38e3b86a4.jpg)
Photon - WebGL experience
https://neuro-symbolic-lab.com/experience/play
![](/uploads/images/20240201/7ef2f32a31d62efcddb19dab62af0b6965bb38e40fab1.png)
SKP-S, WALKING ON MARS
https://m.skp-beijing.com/skps2021aw/index.1.html
![](/uploads/images/20240201/991eba6208467f0a53ac7efa12058f2165bb38e3e9790.jpg)
DR/VRS NFT
https://weownthenight.io/
![](/uploads/images/20240201/50b44a5db368504ae98e189e4b0edfaf65bb38e41115c.png)
Note 1 Advanced Brainstorming - can be refuted in real time:
One of the principles of traditional brainstorming is not to negate, interrupt, or attack when brainstorming, but our team's brainstorming made it clear: Can be interrupted in real time, refuted in real time, real time to meet the attack, if there is a better or more appropriate idea, we will express in real time, and may cause disputes on this issue, in continuous practice, we constantly update our thinking model, constantly go to its dross, before brainstorming, we have prepared for defense, attack, these preparations, In the process of discussion, let us be more efficient, more passionate, and more negative for our words and ideas.
Implementation requirements:
For the needs of ** website, the output of design keywords, these keywords, including feelings and other abstract nouns, professional terms and other conceptual nouns, hot words, demand function, design flash......
|
Methodology
PithyMfweb- Define Business brand website, more methodology please see:
《Official website design must see the user's mental thinking/guide》
《Official website design must see the brand thinking/guide》
《A must-see brainstorm/guide to design》
《Official website design must see color thinking/guide》
《Official website design must see inspiration thinking/guide》
Reference materials:
Whitepaper of Meta Universe Content Marketing Guide | Tesan - Tencent Content Open Platform
"2022 Meta-universe Industry Development Trend Report" : Human society will exist for a long time in the "meta-universe +" model - surging
DISCLAIMERS
back to list