Stradivarius’s New Web Design

Stradivarius is a Spanish clothing brand that has physical stores worldwide. They have yet to infiltrate North America. I decided to use Stradivarius because I have never been to their website or shopped online. I’ve only physically bought in their stores. Below are my ideas for a color palette, mood board, sitemap, and wireframe for their website.

Color Palette

Below is a color palette I made for the Stradivarius website. I love the simple black and white design of the logo, so I didn’t want to go crazy with colors. I have the black and white to match with the logo, and I believe that websites with white background look sleeker. I used black because that’s what I want the text color to be so that it matches the logo. I added grey because it compliments black and white very well. I want the colors for the brand to be effortless and minimalistic.

I added two other colors tan and light pink. I added the tan to stay in the scope of minimalistic colors, and any picture or color can go on top. I chose light pink to add a pop of color into the minimalistic vibe. I also wanted all of these colors because the clothes that Stradivarius sells are basic and have a simple design. I believe that these simple colors will help customers identify the brand quickly. The brand is already easily identifiable due to the music note on the logo, but the color palette is the second way I want customers to identify Stradivarius.

Looking at the color palette, the colors might not seem very cohesive side by side. Still, I believe that once they are incorporated into the website, and they have all of the products next to the colors, they will look like they belong together.

Mood Board

Below is a mood board for Stradivarius, I used a couple of images from their clothing line, and I created some simple backgrounds. I think their aesthetic and vibe is very simple, with some patterns.

After looking at Stradivarius’s clothing and getting a feel for what kind of products they sell on their site, I could create the mood board. The mood board is supposed to help create a vibe or mood for the website. I love the simplicity of Stradivarius’s clothing because it keeps the site simple. The images I chose to use in the mood board are a few of the promo shots for the clothes. Two of them are showcasing the different tones of green; one of them is promoting the different brown and tan colors. One of them is wearing a light blue dress, and the last promo picture has a yellow top with white bottoms. I chose these because they represent the simplicity of the brand while also showcasing their clothes. All of these pictures also have a straightforward background, all of them white except for the one blue background.

I created three background for this mood board because I wanted to showcase a pattern, an animal, and a picture. I decided to create a design because a lot of the clothes that Stradivarius sells have patterns, they aren’t always strips, they have polka-dotted clothes too and other patterns. The other two images are different shades of pink. The pink background with a butterfly in the middle is to showcase the simplicity of designs. The pink background with the image of the clouds is to show that it doesn’t always have to be monotone.

I believe that this mood board demonstrates all of the different aspects of this brand, and I love the simplicity of all of it.

Sitemap

Below is a sitemap for Stradivarius; I decided that I wanted them to have fewer words beneath each category. In the current site map that Stradivarius has, they have all of the possible types of subcategories underneath the broad category. I thought it would be more visually pleasing if the subcategories could put in smaller groups on their pages. For example, in the site map below, the category Clothing has a subcategory of Tops, and once you click on Tops, it brings you to that page, and on that page will be more subcategories of Blouses, Bodysuits, T-shirts, and more. I didn’t want to have all of the small subcategories underneath the broad category because I felt like there were too many options that users could get overwhelmed. Sometimes you want to look at all of the Tops before you know what kind of subcategory of Top you are looking for. I did that for all of the categories.

I decided to add subcategories to the Just In category. I made this decision because underneath some of the other broad categories, Just In was a subcategory. To make it easier, I decided to put those subcategories underneath the general category. This way, all of the Just In clothing is in one place. I love this idea by Stradivarius because this category shows the user all of the new clothes in one place. It’s not in the usual layout of the products side by side. It’s more of a collage with pictures next to each other with no white space showcasing the new products. 

Wireframes

Below on the left-hand side are screenshots of the current layout of the website, and on the right-hand side are wireframes I created using existing elements. The most significant change I made is where the menu is. The original site has a hamburger button on the top left corner, seen on the homepage, that creates a drop-down menu. I created a bar menu at the top of the page to make it easier to see what all of the categories are. I wanted to keep some of the stylistic options the same because I thought they looked unique. Usually, when designers create wireframes or wish to change the way their website looks, they conduct tests to discover what their users want on their website. I didn’t perform that kind of testing, so I created the wireframes to how I think users might prefer because having the menu at the top of the page makes it easier to flip between categories while shopping. I also added a red box around the category that is clicked on to remind the user what category they are looking at. I chose red because I felt like it fit with their look.

Homepage
Sale Page
Clothing Page
Accessories Page
Homepage Wireframe
Sale Page Wireframe
Clothing Page Wireframe
Accessories Page Wireframe

While Stradivarius already had a beautifully simple layout and design, I wanted to add a bit more simplicity to it. I love the images they used, so I tried to incorporate them. One thing that I admire about this website is that they have almost no negative space. On their homepage, they have pictures connected to pictures, and it creates a beautiful aesthetic.


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s