Are you looking to create a custom theme for a WordPress website? Custom themes are created based on mockups, and mockups are created using mockup tools. Some of the most popular mockup tools are Photoshop, InVision, SketchUp, Zeplin, and Atomic. ThemeSupport specializes in creating custom themes, and one of the most common ways we do this is through PSD to custom theme development. We hope this blog can answer some questions you may have about mockups, mockup tools, and the services we provide.
What is a Mockup?
A mockup is the completed version of your website design. One way to think about a mockup is that it’s like the blueprint of your website. Website developers use mockups that have been created by designers to build websites. There are many programs that allow a designer to create mockups. (We’ll talk about these programs later in the blog.) A common way to create a website from a mockup is through PSD to custom theme development.
What is a Custom Theme?
First of all, it’s important to understand what a theme is. A WordPress theme is the design of your website, or the look and feel of your website.
A custom theme is a design that is created specifically for your website, which makes your website unique. One way of thinking about a custom theme is like building a house. You get to choose all of the details: the colors, the fonts, the layout, the function, the pictures, the videos, etc.
There is a difference between a WordPress custom theme and a customized WordPress theme. A WordPress custom theme involves a graphic designer. The designer will create the design of the website with various tools and will be involved in asking what you want for your website. A website developer can then help convert your design into a WordPress theme. A customized WordPress theme is a WordPress theme that already exists (a premium theme), but someone helps you customize that particular theme.
ThemeSupport offers both of these customization options. We can help you customize a WordPress theme or we can create a customized theme for you.
What is Mockup to WordPress Development?
There are numerous ways and multiple programs that allow a designer to create a mockup of a website. Mockup to WordPress development essentially means a website developer has created a custom WordPress theme based on a mockup. PSD to WordPress development is a common way to turn the design a website into an actual, functioning WordPress website, and it is one way of creating a custom WordPress theme.
How do I create a Custom Theme with a Mockup?
ThemeSupport can create a custom theme using mockups! One common way we do this is through PSD to custom theme development. We can help you create your own custom theme and your own custom website.
The first thing we need in order to start building the draft of you website is a mockup. We will draft a website for you based on the designs in the mockup. After we have finished drafting your website, we will then work with you until the website looks and functions exactly how you want.
As mentioned above, PSD to custom theme development is very common. In fact, the most common design file type that we receive is PSD, so we thought it would be worth addressing what PSD means and what it is.
PSD stands for Photoshop Document and it is the default file type used in Adobe Photoshop. A PSD file is a layered image file. This means that you can still edit the various layers of your document after it has been saved. Once you’ve converted your PSD file to another file type, such as a JPEG or PDF, you can’t edit the layers anymore. So when you or your designer are creating the look and functionality of your website, you can change and edit the layout of the website design with a PSD file.
Top 5 Design Tools
A mockup is created using a design tool. A website designer can use a variety of tools in order to help you create the layout of your website. These are some of the most common design tools:
Photoshop
Photoshop is one of the most common design tools to create website prototypes, and allows you to create a PSD file. This file is flexible and allows you to make edits if you want to change something later. There are many other file types you can use in Photoshop, which makes it a flexible design tool.
InVision
InVision lets you make an interactive design. With InVision, you can take a 2-D Photoshop document and make it interactive. This interactive feature helps you see how the website is going to function and how it it is going to look as a final product. InVision supports the following file types: PSD, Sketch, GIF, PNG, or JPEG.
Sketchup
While SketchUp is used to create 3-D documents, SketchUp can convert a 3-D document into a 2-D document. This 2-D document is the mockup we’ll use to create a draft of your website. A common file type in SketchUp is a CAD file. CAD stands for Computer Aided Design. CAD files are used for 2-D and 3-D design.
Zeplin
Zeplin is a newer design tool. ThemeSupport recently worked with a designer who used Zeplin to create their website mockups, and we had a very positive experience working with this design tool. One of Zeplin’s main goals is to make it easy for designers and developers to work together.
For designers, you only need to upload the specs and Zeplin will prepare them for you. With Zeplin, everything is saved on the cloud.
For developers, Zeplin allows you to easily inspect the specs and easily converse with the designers about your questions or things that need to be modified.
Atomic
Atomic focuses on combining prototyping tools with design tools in order to make an effective prototype. Some of the features Atomic emphasizes are rapid prototyping, data driven interfaces, and using the cloud. Similar to Zeplin, by using the cloud in designing, it makes it so members of your team who may be working on the design with you will be able to access the document and edit it alongside you.
White-labeling
White-labeling is when a company hires out another company to create a product for them, such as a website, and can then re-brand that product as their own. Think of white-labeling as a type of outsourcing.
ThemeSupport offers white-labeling services. As mentioned above, ThemeSupport specializes in developing custom themes based on mockups, especially in PSD to custom theme development. While ThemeSupport can white-label a website based on a WordPress premium theme, we specifically white-label for custom themes based on mockups. If you have a client that is looking for a custom theme, contact us today about our white-labeling services.
We can Help!
ThemeSupport specializes in website development, and we have frequently worked with PSD to custom theme development projects. We have experience creating custom themes based on mockups that have used Photoshop, InVision, SketchUp, Zeplin, or Atomic to create the website design.
Whether you are looking to build your own custom theme or are a designer who has a client wanting a custom theme built for their company, we can help.
