In May of 2014, what would be our second startup came to us, with a request to estimate the complexity and the cost of an application that generates a mosaic from user's photos. In November, the order was canceled, but we liked the idea so much that we decided to research the most popular mosaic generation services. Research has shown that all of these websites have issues with either UX, technologies used or both:
After analyzing the pros and cons, we allocated a budget and a staff for taking on this project as our own startup and the work began. We developed wireframes and invested a lot of time in developing the design. As a result, we came to the conclusion that the best course of action, with UX in mind, was to build the main page that users can immediately start creating mosaics.
Mosaic creation consists of 3 steps:
You can download the preview image, share it with friends in social media networks or buy a high resolution version to print.
At the beginning of 2015, we launched the project. It received solidly positive reviews and scored quickly attendance. People liked the convenient design and nicely featured UX.
We managed to solve the following tasks:
In May of 2015, the project was sold and the copyright was transferred to the new owner.
We reserved the development rights and now we are maintaining the website.
We’ve been in the market since 2005, and we always try to simplify and speed up our daily operations. One of the major problems that we faced every day, is the presentation of project structure and mockups.
"I smile when I think back on the days when I had to go to a client personally to present mockups. I had to show him in person to be sure that the mockups are correctly displayed and understood.
During the presentation it was so important to follow the correct order and it was pretty inconvenient to switch from one mockup to another. There were some other issues, for example, it was not easy to store all the comments and suggestions regarding mockups. This was already difficult enough, not to mention travel time, wait times and traffic jams"
In early 2014, we decided to create a convenient online tool for organizing project presentations to the client. We had to solve a number of issues for this:
The company allocated a budget and a staff to work on this startup. We started looking for turnkey solutions but the existing ones did not meet our requirements. We decided therefore to establish the SaaS service for ourselves and to help other designers and web studios.
As a result, in early March of 2014, the first version of the project was launched. Until September of 2014, we were working on various updates for this service. We managed not only to achieve the goals, but also to surpass our own expectations. The service consists of 3 parts: a selling website, tools for designer and tools for presentation. The principle of operation is as follows:
The project was picked up very quickly by our customers. After that we decided to launch an advertising campaign to promote the service. Unfortunately, our budget was not enough and we stopped the promotion of this resources.
When monitors with cathode-ray tubes started disappearing, new monitors with a variety of sizes and resolutions started appearing at the market. Later it became necessary that the websites would be beautifully displayed on the most popular resolutions and would be adapted to them. At the end of 2010, we started working on the solution for this problem.
We experimented a lot and concluded that a decrease or an increase of the font didn’t give the desired effect. It was necessary to change the size of all the blocks, icons, images, fonts, and even background images. We examined all the popular resolutions at that moment and their usage statistics. We divided them into 4 groups and for each group determined the size of the workspace, padding, and recommended sizes.
One of our regular customers agreed to try to build his website using our new technology and we began development. For the first time we drew layouts for more than one screen size. For us, and for the customer, it was important to understand what the website should look like on all possible resolutions. Also we had to provide a high-quality mapping for the website where one size flowed into another. We made it a rule that all 4 sizes for the user website should look the same, but it shouldn’t be just a proportional shrinking of the entire layout. We conducted some additional tests and found out that on bigger screens it was more important to increase the font size rather than the size of the images. As for tablets, it was interesting to see that the font size had to remain large to make reading easier. The size of the images could be reduced significantly.
The next step we needed to automate the process. We took main.css as the foundation. We decided to add comments to the styles that should change depending on the screen size. The comment included changes to style properties for each size. Then, during the deployment a small php script forms a file for each size and stores it in the data folder. In this way, each project contains 4 sets of styles and images. Pictures have to be created manually because each size requires pictures of different proportions. This does not apply to the background images, but we also store them in 4 sizes for faster downloads on small screens and better quality on the large ones.
After the successful launch of the first website that used 4size technology, we applied for copyright registration and after 6 months we obtained a copyright for this technology. At this moment we’ve developed more than 25 sites using the 4size. These were mostly the websites for public companies, for which it was important to have a high resolution showcase.