Home116´s Portfolio website design

116´s Portfolio website design

April 2017
116´s Portfolio website design
116´s Portfolio website design
116´s Portfolio website design
116´s Portfolio website design
116´s Portfolio website design
116´s Portfolio website design
116´s Portfolio website design
116´s Portfolio website design
116´s Portfolio website design
Description

OneOneSix (116) is a collaboration project of TheLabSaigon and Nilead. In this project, Nilead took the position of the web technical service provider to implement the new website interface of OneOneSix:

 

  • We collaborated with TheLabSaigon design team to turns the still design into a working website.
  • We helped TheLabSaigon and 116's team to work out improvements on the design using our web design experience.
  • Nilead team provides technical training and documents for OneOneSix team to manage their website.

 

Nilead's objective was to create an outstanding website based in the original design provided by TheLabSaigon to elevate 116's brand, showcase their philosophy and hard work through their versatile portfolio. The website also serves the purpose of a communication portal aiming to attract potential customers and partners, and generate new leads.

To accomplish this: we focus on creating a flexible layout with an easy and intuitive management system that allows 116 to showcase multiple gallery sections with their projects in a minimalist style. At the same time, the website should be easy to navigate and work for all the major devices with special focus on mobile devices.    

 

SINGLE PAGE LOADING EFFECT  

One of the small yet fascinating features we did for 116 was a fake single application effect. With the client's requirement to have the website to load like a single page application, we considered several options and did not feel confident that using AJAX to load the website is a good solution for Search Engine Optimization purpose. Even with Google bots now capable of processing javascript on websites (only to a certain extent), not all search bots can do the same. What we did, in the end, was to fake a one-page loading effect while still keeping each website page under its own URL and capable of being accessed directly via unique URL.   

 

FLEXIBLE LAYOUT

Based on the client's need to edit and upload new content (images and videos) regularly to the gallery sections on the website without breaking the layout, we created a block design system. Depend on the number of blocks in the design, the blocks size and position can be adapted to fit the layout design automatically. This flexible block design system and Nilead's CMS empowers 116’s management team to update content in an easier and efficient way.

 

EASY NAVIGATION

We implemented a sub navigation system that is only displayed under specific sections when necessary to avoid cluttering the navigation system. Throughout the design and improved UI/UX, we never lost sight of the end goal: The user, after seeing the portfolio, should be able to contact 116 for their services in an easy and fast way. To remove all complication and distractions we placed a call to action button on the navigation bar, allowing the user to contact 116's team with a simple two clicks process.    

 

MOBILE-MINDED

Today’s users can access online information from diverse devices, and they expect the mobile experience when navigating a website to be as good as in a desktop computer. The responsive designs for 116’s website aren’t just scaled down version of the desktop design; they are designed and developed deliberately and uniquely, with an absolute focus on every element. We adapted the responsive functionality and overall design aesthetic of the site in order to improve the user experience on the website and meet their expectations on usability and load times.   We have run various tests to ensure best user experience on these devices and made many changes along the way using real users' feedbacks. While it's impossible to run tests on all mobile devices, we picked the most common Android, iOS, Windows phones to run test ensuring better compatibility.

 

Check the complete version of Oneonesix's case study  

https://nilead.com/portfolio/oneonesix

116´s Portfolio website design

April 2017
Responsive Web Design
Web Design
web development
UI / UX design
Motiongraphic
Responsive Web Design
Web Design
web development
UI / UX design
Motiongraphic
Description

OneOneSix (116) is a collaboration project of TheLabSaigon and Nilead. In this project, Nilead took the position of the web technical service provider to implement the new website interface of OneOneSix:

 

  • We collaborated with TheLabSaigon design team to turns the still design into a working website.
  • We helped TheLabSaigon and 116's team to work out improvements on the design using our web design experience.
  • Nilead team provides technical training and documents for OneOneSix team to manage their website.

 

Nilead's objective was to create an outstanding website based in the original design provided by TheLabSaigon to elevate 116's brand, showcase their philosophy and hard work through their versatile portfolio. The website also serves the purpose of a communication portal aiming to attract potential customers and partners, and generate new leads.

To accomplish this: we focus on creating a flexible layout with an easy and intuitive management system that allows 116 to showcase multiple gallery sections with their projects in a minimalist style. At the same time, the website should be easy to navigate and work for all the major devices with special focus on mobile devices.    

 

SINGLE PAGE LOADING EFFECT  

One of the small yet fascinating features we did for 116 was a fake single application effect. With the client's requirement to have the website to load like a single page application, we considered several options and did not feel confident that using AJAX to load the website is a good solution for Search Engine Optimization purpose. Even with Google bots now capable of processing javascript on websites (only to a certain extent), not all search bots can do the same. What we did, in the end, was to fake a one-page loading effect while still keeping each website page under its own URL and capable of being accessed directly via unique URL.   

 

FLEXIBLE LAYOUT

Based on the client's need to edit and upload new content (images and videos) regularly to the gallery sections on the website without breaking the layout, we created a block design system. Depend on the number of blocks in the design, the blocks size and position can be adapted to fit the layout design automatically. This flexible block design system and Nilead's CMS empowers 116’s management team to update content in an easier and efficient way.

 

EASY NAVIGATION

We implemented a sub navigation system that is only displayed under specific sections when necessary to avoid cluttering the navigation system. Throughout the design and improved UI/UX, we never lost sight of the end goal: The user, after seeing the portfolio, should be able to contact 116 for their services in an easy and fast way. To remove all complication and distractions we placed a call to action button on the navigation bar, allowing the user to contact 116's team with a simple two clicks process.    

 

MOBILE-MINDED

Today’s users can access online information from diverse devices, and they expect the mobile experience when navigating a website to be as good as in a desktop computer. The responsive designs for 116’s website aren’t just scaled down version of the desktop design; they are designed and developed deliberately and uniquely, with an absolute focus on every element. We adapted the responsive functionality and overall design aesthetic of the site in order to improve the user experience on the website and meet their expectations on usability and load times.   We have run various tests to ensure best user experience on these devices and made many changes along the way using real users' feedbacks. While it's impossible to run tests on all mobile devices, we picked the most common Android, iOS, Windows phones to run test ensuring better compatibility.

 

Check the complete version of Oneonesix's case study  

https://nilead.com/portfolio/oneonesix

Work details
work
Client
Oneonesix
place
Location
Gia Lai Province
business
Industry of the client
Media
people
Audience
Business to Business
public
Geographic scope
International
settings
Service provided
Web Design
Looking for an agency providing that kind of service?Start a project

Works made by other agencies

Check the latest works made by other agencies
Phú Mỹ Re-Branding

Phú Mỹ Re-Branding

March 2018
March 2018

Phú Mỹ Re-Branding

Being able to survive in an ever-changing landscape is the biggest challenge for all brands. That's why we strongly believe in responsive brands.

Branding & Positioning
Content Strategy
Website Creation
Graphic Design
Copywriting
Photography
Pharmascience's website design

Pharmascience's website design

April 2017
April 2017

Pharmascience's website design

We partner with Pharmascience to create a public-facing website focusing on their Vietnam based operations. The main goal was to promote and sell the company values, from their background story, quality standards, philosophy to their diverse pharmaceutical products; targeting the patients and healthcare professionals in Vietnam.  

  • Based on Nilead experience and knowledge of the Vietnamese culture and target audience, we design and develop a website for the Vietnamese branch of Pharmascience Inc., following the brand identity and guidelines provided by the headquarters in Canada.
  • Nilead team provided technical training and documents for Pharmascience's team to manage their website.

Pharmascience needed a multi-language and responsive website based on its already established brand identity, but at the same the new website time should stand out by itself and could engage with Vietnamese users. To achieve this, we focused on designing an engaging, informative, and easy to use the website for visitors and invested parties seeking information on Vietnamese-based services offered by Pharmascience Inc.

 

BUILDING THE WEBSITE  

Our work from the design perspective was to connect their aesthetic vision and standards with Vietnam’s users. Pharmascience is already an established company with a strong graphic image, we design everything based on their branding guidelines. Because of the language barrier we have to modify some of the elements of the brand identity to be compatible with the Vietnamese culture, always with the supervision and authorization of Pharmascience’s marketing team, we know how important is to maintain the integrity of the brand identity.    

 

FLEXIBLE LAYOUT  

Pharmascience´s website was designed with 12 columns grid layout as a base, this allows a more flexible element arrangement in the design. With this flexible structure, the developers and designer can build a more fluid and detailed responsive version of the desktop version of the site for all major mobile devices.    

 

SOCIAL MEDIA PRESENCE  

One of the main goals of Pharmascience was to engage the Vietnamese users, promote and sell the company values. On the basis that 30% of the Vietnamese population are active social media users, we focus in to establish a connection with the site and Pharmascience social media channels.   By including Social Media feeds on the website, the user will be able to check on real-time every Pharmascience’s posts without having to leave the website. We integrate different sections of the website with the most popular social media platform in Vietnam, that way the user will be able to share the content on the site, increasing the brand awareness, traffic and leads for the business.    

 

ALL ABOUT INFORMATION  

Based on the main target audience of the site were the healthcare professionals and the need of Pharmascience to promote their products, we developed a product section with every medication commercialized in Vietnam by Pharmascience. In this section, the users can check the properties, treatment usages, category, selling format and general prescription information of every product.  

Besides selling their products, Pharmascience website has a purpose of promoting the company values. Creating a news page will help then to communicate their philosophy and standards, at the same time they will publish information about the latest discoveries in the health and pharmaceutical community, and different subjects regarding Canadian society that are in the best interest of their target audience. With this Pharmascience aims to become a reliable, easy and fast source of information for their users.    

 

DESIGNED FOR TOUCH DEVICES  

With the number of smartphones approaching almost 40% of the population of Vietnam, the cheap data plans and the nearly coming 4G, Vietnamese users tend to navigate the internet more through their mobile devices than regular desktop computers. With this in mind, we designed and developed every element of Pharmascience´s website thinking of the mobile user experience. We custom designed the responsive version of the website featuring touch gestures that match the user experience, improving the navigation of the site.    

 

EASY ACCESS TO INFORMATION  

The website was designed and developed mainly for doctors who use or may want to use Pharmascience products. These doctors are mostly 40+ year old and thus would prefer a simple, straight forward navigation system. We worked with Pharmascience team to keep the menu as easy and simple as possible while still trying to provide all the necessary information for the users. Having in mind the wide range and amount of content that Pharmascience provides on their website, we designed a search function that elevates the user experience on the site.With a simplified and friendly responsive design, we let the user search the different types of content within the site in the least possible amount of clicks.    

Check the complete version of Pharmascience's case study  

https://nilead.com/portfolio/pharmascience

Website Creation
Thailuxoutlet

Thailuxoutlet

May 2018
May 2018

Thailuxoutlet

E-commerce
Website Creation
Blockchain solutions

Blockchain solutions

July 2018
July 2018

Blockchain solutions

Ulabs is platform for building the world’s decentralised cloud storage network where you get total control of your files while enjoying rock-bottom pricing tied together with personal ownership, maximum privacy and enterprise-grade security

Website Creation
Digital Strategy
Branding & Positioning
Ergonomy (UX/UI)
Graphic Design
Hanoi Trail Run

Hanoi Trail Run

April 2019
April 2019

Hanoi Trail Run

Website Creation

Let us guide you to the best agency

From web design to advertising campaigns, we guide you to the right agency fitting your needs and budget. Then, compare and hire the one that’s right for you.

Find my agency

100% free - Fee is charged to agencies willing to collaborate with you.