Points to be aware of when creating a site design with SHOPIFY

by Rin Hirashin

When building a site in SHOPIFY, it is necessary to use a customizer and create it while adjusting the section.

Depending on the theme for that, the width of the design layout and the design that can be designed will change significantly.

This time, I will tell you the points to be aware of when building a design when building a site in SHOPIFY!

Point ①

Select a theme and start designing the design

As you have chosen at the beginning, it is necessary to first consider the theme to build a site in SHOPIFY.

Once you have selected the theme after the design, it will take a long time to consider the theme that can be created.

In the worst case, rebuilding the design from scratch can have a significant impact on the site construction schedule.

In order to avoid these cases, we recommend that you first select theme.

In the past, we introduce recommended themes, so if you have any problems with the theme.HerePlease refer to.


Once the theme to use is decided, download the theme to the store.

From here, we will create a site concept and layout with the customizer.

Point ②

Design while creating with a customizer as much as possible

Next, check and add the necessary sections in the page.

Here, the range you can do is the standard, and the parts that cannot be done are recognition that requires customization.

It is important to consider the composition with a customizer to make a decision that you can do or not.

After creating to a certain extent that you can do to a certain extent, use a screenshot to make the layout created by the customizer on each page, and put it on a design tool such as a figure.

For fonts, the fonts that can be selected are limited when using the default settings.

By setting the color and fonts for that purpose first, it is possible to work with figma efficiently.

Point ③

Fine adjustments are proceeded while checking with the engineer each time

There is also a design that can be done by editing the code even with a customizer and difficult design.

By confirming that the created design can really be implemented, you can proceed efficiently with less subsequent corrections.

In addition, there is an advantage that you can decide the schedule when the construction starts by proceeding while checking the actual number of man -hours.

At first, it is difficult to judge the design that can be done and cannot be designed, but by checking each time, you can make a drawer from the next time that will be your knowledge, so we recommend that you check if possible.

These three points are particularly important points to be aware of when creating a site in SHOPIFY.


Finally, here are some examples of how much the design changes when you actually do a design customization.

Case

ABOUT page of our official websiteNow we are customizing the following.


  • Enter the title of the image character
  • Design to overlap the title and text to the video
  • Video automatic playback

It is as follows when compared with the image.

If you are not designed

Image without design custom

When the design is customized

In this design, "Video Hero" section "Heading_image "and""TextHeading" is added and displayed on the video.

If you want to stick to the design, as shown in the attached image, you need to edit the code.

This time, I told you about points to be aware of when creating a design when building a site on SHOPIFY!

Go Ride has also renovated the site that has already been built and has already been published.

If you have any problems, please do not hesitate to contact us if you have any problems, such as not being able to make a satisfactory design even if you build it!

TOYO HIRASHIMA

Rin Hirashin

Account Manager/Designer

"I Keep Making an Effort for My Dream.

この著者の記事一覧

Request for materials

Providing one-stop service from e-commerce development to advertising management.

Download Whitepaper inquiry