The Startup Design Framework is advertised as a tool primarily aimed at start-ups who are looking to build a better website for their organisation or project. While it’s not a WordPress-specific tool, those looking for a different approach to making websites should find it interesting. The framework has been developed by the Designmodo team and is a premium product available through their website.
The tool can be used by designers, developers and theme creators alike and allows users to build websites much faster and easier than they might be able to otherwise. Although the product is marketed at those building websites for start-ups, it could just as well be used by anyone creating a website for almost any purpose, including those designing themes for clients. To view two sites built using this framework, check out the Hipsta Food and Crumbs websites.
This is a sponsored review, it is completely my opinion and not influenced in any way by being paid. If you would like to order a sponsored review, please visit our promotions page.
The core feature of the Startup Design Framework website builder is its ‘block model’. This is a collection of components or blocks, that can be arranged in any combination, allowing you to easily build the layout for your site. By merging the different blocks together in any combination, the tool can be used to form countless website configurations to suit almost any requirements. By default the websites built with this tool will be based on a one page layout, which results in a long, vertical scrolling page, with each of the sections following on from the next.
For each of the different block types there are many different versions available, such as a choice of 23 different header blocks. In total the full version of the Startup Design Framework includes 100 components. The blocks or components are divided into the following categories:
- Header (typically includes a content area and the website navigation menu)
- Content 1 (main area for content, can also include images, banners, buttons, and icons)
- Content 2 (another content area, can include videos, signup forms, grids, and sliders)
- Footer (options to include maps, links, banners, and signup forms)
- Projects (ideal for displaying portfolio items)
- Price (different options for inserting a pricing table)
- Blog (different layouts for adding blog posts and other blog features)
- Crew (options for adding a meet the team section, including photos and social links)
- Contact (selection of different blocks to show contact details with options forms and maps)
While your design would typically only feature one header block, it could have multiple content blocks, and project blocks if required. The HTML and CSS for each of the blocks can be edited, allowing users to make as many changes as required.
To help keep this site builder fresh, the team have vowed to add more components and blocks to the package on an on-going basis, as well as also removing those that become outdated. Users can also expect additional functionality to be added to the tool in the future. You can view the changelog for the Startup framework to get a sense of what work is being done on the tool.
The samples that come with this builder are another of the main features of the tool. The included samples consist of 25 sites which can be used out of the box, or modified by adding or removing elements using the block model.
To get started as quickly as possible, simply pick a sample layout and then add your own content, or alternatively edit the existing layout by swapping out page elements using the included blocks or components that come with this tool.
The blocks that come with this tool, which are used to create the sample sites, all have a similar overall appearance which means they can all be used on the same project and interchanged freely without any jarring conflicts in design and functionality. This doesn’t mean that all the samples look the same; it just means that they are all similar enough to work together in any combination.
Responsive Layouts & Retina Ready
All of the components that are part of this WordPress website builder are responsive, so the designs and themes created with this tool will work just as well on small screen mobile devices as they will on full sized desktop displays. The framework is based on Bootstrap v2.3.2 with plans to move to v3 in the future. The tool is also retina ready so it is able to make use of the extra clarity provided by these high-end screens.
The framework includes the files from the free version of Designmodo’s Flat UI product, which as the name suggests includes user interface elements such as buttons, menus, alerts, forms, and tables, created using the flat design style.
To get access to more items, such as a bigger library of icons and glyphs, which can be used to increase the options for the page elements the pro version of the Flat UI pack can be purchased and the files used with this framework. Alternatively another UI set could be just as easily be used.
Using the Startup Design Framework
As the framework uses the HTML5 doctype, you must first create an HTML file with the correct heading, and then copy the code for each of the blocks you want to use and paste them into that file. Although the samples demonstrate sites using the one page layout, there doesn’t appear to be any reason why you can’t create multiple pages with this framework, each with their own header and footer, with one or more of the content blocks in-between.
The framework comes with 25 samples. These are fully built websites made using different combinations of the available blocks. They each include all the necessary image files and can be edited to change the order of the blocks or add in additional ones.
The setup and configuration process is all covered in the documentation that comes as part of download file for the framework and is easy to follow.
Once you’ve built your new website, you can then upload the files to your server to make it visible online.
The zip file for this builder, which weighs in at over 500 MB, contains all the files needed, as well as the documentation covering how to create the pages. The documentation is easy to follow and provides all the information required to use the package. Video tutorials are expected to be made available soon according to the website.
The Startup Design Framework costs $ 249 and when you consider how versatile it is, allowing fairly non-technical of users to create a webpage for their start-up or other projects, it starts to look a lot more affordable. If you are a web or theme designer creating sites for clients, then the amount of time this builder can save you is also something to be considered when evaluating its value for money.
As it comes with 25 different samples, which are effectively full websites with interchangeable components, the cost works out at around $ 10 a site template. However, by interchanging the different page blocks, the number of outcomes is close to endless. The full version of the Startup Design Framework costs $ 249, with additional licenses available at $ 149 per license.
With the cost of this website builder framework, it means its best suited to those who want or need to be able to easily create a range of different layouts, rather than someone needing to build just one site. This is thanks to the use of the interchangeable blocks and the multiple versions of each block available, which makes the Startup Design Framework ideal for those who want one package that can create many different looking sites.
Those who need to create a range of different versions of a site for a client would also greatly benefit from this tool. This is due to the set of 25 included templates that can be easily rearranged based on client feedback. Changing the order of the different blocks is easy, as is adding in one or two blocks from another templates to create a new look or add a new feature.
If you want a tool that can help you create a range of sites with different layouts and comes with plenty of different types of content, such as forms, sliders, tables, and more, and you don’t mind the price tag, the Startup Design Framework is a great choice.