I was at Stewart+Brown for four years and in that time I taught myself how to program and write code then ended up doing much work on the website front and back-end. I was in charge of all development, updates and copy writing in addition to assisting with the design and marketing and making new designs based on existing templates. I developed the site’s entire front end and enabled it so that anyone in the office could make updates. I also developed a comprehensive production tracking system that tracked all information about a garment from conception to production to sales. Please see the rest of the page for more information about each page.
Collections Page: Every page on the Stewart+Brown is controlled by an admin tool where you can upload photos, organize them and add information about each image like a description of the theme and a list of styles that are pictured.
Collections Admin: This is the admin controlling the page above and a page like this exists from every page on the site. The user enters the position and a list of styles and I wrote a script that parses each style, checks to see if it’s available in the store and if it is, shows a link. If it’s not active, it just shows the style name with no link.
EStore: This is the front page of the estore which is running on Miva Merchant shopping cart. I tended to manipulate the standard options in order to mimic functionality we saw elsewhere on the web. Because of this, Miva featured our store and I got to do a little interview, very exciting. This page is also run by an admin tool which allows anyone to pick the styles that are shown and upload the images. The information and links to each style are populated by a script I wrote.
Shop By Look: The shop by look feature was one we wanted to play with an see how people liked it. I hacked Miva in order to create by own page layout and creating the outfits is as simple as typing in their style numbers.
Product Page: Howard and I designed this page together and incorporated details like roll over color changes on images, large print swatch details, ‘color shown’ changes every time the picture is changed, list of items the image is pictured with as well as a list styles that the user may also love.
Inventory Tracking: While the shopping cart package offered ways in which to tell which styles are sold out it was surprising hard to stay on top of such information since one would have to manually activate and deactivate the colors and sizes shown. I tried many many times to automate this process but alas, had to resort to this helpful tool. A user uploads an inventory report into the system and runs this check which tells which colors and sizes are being shown even though there may not be inventory for them.
Additional Feature Tracking: Another thing that was really hard to track was which styles were being shown with what and whether or not the styles they were shown with were available in the store or not. I built this tool which analyzes the databases and reports errors.
Order Statistics: One of the features on the product pages is a little box which shows what styles the user “would also love.” In order to make more accurate choices of what these styles would be, I wrote a script that tracked the frequency that, if one product was ordered, the number of times another style was ordered.
Image Tracking: Keeping track of images also becomes daunting when there are so many products in the Estore and, being a company owned by an artist and designer, we were very particular about the flow, ordering and choice of images. I built this to offer a quick look at each product in the store and the images we are using for them.
News / Blog: This offered us a way to give more a voice to the company and interact with our customers. I developed it in WordPress and created a custom theme to match the site. I also programmed it so that a link to a style is created when a user enters a snippet of code with the style number of the item shown in it. That little snippet queries the store’s database and returns an active link if the style is for sale or simply the style name if the style isn’t on sale.
Blog Content: This is one of the favorite stories I wrote for the blog at Stewart+Brown. We wanted to show how versatile our “Lengthened Tee” is so I sent an email to everyone in the office to make an outfit with one. The next day, I had everyone bring their clothes in and we flat shot the outfits and posted them on the website. I had each “person” holding something applicable to their position at Stewart+Brown just to mix it up. We also tied it into a contest for other readers to make outfits in an artsy fashion and I loved the response. We got a lot of really cool entries and it’s always fun to interact with the people you’re creating these stories for.
Newsletter: When it came time to create a newsletter we at Stewart+Brown needed something that would be visually compelling, informative, wouldn’t take much time to create and would reuse assets already in our store and blog. Howard Brown and I worked on the design together and I wrote the code, tested it on a bigillion email clients and then built and admin tool to populate it.
Newsletter Admin Tool: I wrote the admin tool in PHP and had it query our WordPress database to auto-populate editable fields with stories from our blog. When it comes time to publish a newsletter a user visits the admin tool and puts a number next to each post they want to include and also has the ability to edit the copy, the link and select which image from the post they want to use for the newsletter. When they click generate, a email tested and approved html page is created that they can then send via our mail manager.
Image Finder: Being a small company, there came a day when our normal customer service girl was out of town and I would take over for her. I noticed that the majority of emails for customers would be about products and what they looked like and what colors they came in etc. Each time I would peruse the estore looking for the styles to include them in the email but it took forever! I built this little tool so it would be as simple as entering the number to get all the images on file.
Return Authorization Admin: Inevitably with any Estore, there are returns and we needed an efficient way to track who was returning what, who got refunded and who didn’t etc. I built this tool to keep all of that information in one shared place that we could all view. That way, the production team could see what styles were being returned for something like fit issues and the business team could track how much money was moving around etc. There is an additional tool that lists each returned style as well as the amount of times it was returned an the reason for each.
Affiliate Buyers Area: We started working with a few retailers in order to help rid of pesky old inventory. We wanted a convenient way for these affiliate shoppers to view the products that we wanted to unload. We would create this a custom username and password then they could log in and shop the styles we picked for them in addition to seeing up-to-date inventory numbers for that style so they could place their orders quickly and easily. Most of the shoppers were really impressed by the simple to use interface and it helped them a lot when placing orders.
Affiliate Admin: This is one of a few pages that I created to track the inventory we wanted to show the affiliates. I created these grids based on a inventory report we would upload and we could check and uncheck the styles and colors that we wanted to show. Each affiliate had their own customized list and it was simple enough for anyone in the office to add and update the information.
Style Archive: Early in my Stewart+Brown career, I was the production assistant and part of my job was tracking samples and production. I kept a list on excel of all the styles we had ever made and one of my first programs ever was putting that list online. I just looked at some of the other code on the site and after figuring out what an array was, made it work for me. Over the years I built more and more functions into the system and by the time I left it had a life of it’s own and was responsible for tracking nearly every aspect of design, development and production. It was so efficient that we even opted out of purchasing an expensive out of the box system that was really popular within the industry. I like to pat myself on the back for that and the fact that even a year after I’ve left the system is still up and running with no major problems or errors. What you see to the left is a list of all the styles for a season with boxes representing every season they have been produced in.
Style Info Page: This is the page you get to when you click from the previous page. It displays all of the product information and is continually updated as the product is developed. Available colors are specific to the season (as tracked by another tool) and are specific to each delivery. This information is used everywhere this style is shown on the site and so updating information is as easy as updating it in this single location.
Autogenerated Line Sheets: This information in the style archive populates a linesheet that is used to send to buyers and showrooms to place their orders. Previously, we build these files in Illustrator and they took forever to make and were always filled with errors since information is constantly changing. Since all of the information was most up to date, I proposed converting the linesheet to being something created online. I had to fight for it since others were afraid that it would compromise the design and layout. I created the layout based on an existing line sheet and made if fully customizable. You can control what styles go on which page, the order of the styles and even control which distributors could see which styles. To create the pdf, one just hits print and the prints it to a pdf with out all the editing marks. Works like a charm.
Style Orders Page: This shows the order grids for this style. Orders are input online in a common area and are used by the system to calculate the amount of fabric and materials to order in addition to providing a central location in which to view an share information. Before this, all orders were on paper and revisions were lost and mistakes rampant. Even when we were just testing the system, we found a discrepancy between orders, hazzah! Orders are also subdivided for delivery and tracked by projections and actuals.
Style Materials: This tab on the style shows the materials and amounts of materials used based on the order grids. This aids the production team in tracking orders and pricing.
Color Archive: Similar to the styles archive, another archive exists for each color Stewart+Brown developed showing which season it was used as well as a swatch that is used in every other place on the site where this color is shown. When adding a color, it checks to make sure the color code or name hasn’t been used.
Lab Dip Tracking: When developing colors one must produce series of lab dips with the dye house in order to get the prefect hue for each material the color will appear in. This database tracks lab dips and their approvals keeping a record of color codes and dates they were approved. Once a color has been approved, samples can be created in that color which leads to my next image.
Sale Sample Tracking: This database shows each style as well as the colors it was sampled in. For those unfamiliar, a sale sample is a garment that is produced before the season in order to sell it. This database allows you to track which samples will go dye and when they will be ready. This helped us keep track of all the styles since multiple dye batches are used and without the tracking, it was easy to forget which styles were where and when they would be coming back.
Pattern Specs Tracking: Before a style can be sampled there has to be an approved pattern for the style. It works as follows, the designer comes up with an idea for a garment. The pattern maker (who’s craft is amazingly interesting to me) makes a pattern for the idea. The pattern is sewn and fit and the pattern is adjusted for a better fit. This database tracks these revisions and all the files are hosted on the server so they can be downloaded and shared at anytime. Status updates are also applied to let others know when the pattern is approved or what adjustments it needed.
Materials Tracking: Once all styles are ready for production, the system can track which styles use which materials and how much each of the materials will be used and how much they will cost. Adding materials is done by looking at a list of styles and adding an amount per garment. Yields and costing are calculated by cross referencing the orders database to get a number of how many will be produced by size. Materials can vary within a style (for instance, printed fabric vs. solid fabric) and the system is smart enough to track on a color specific scale.
Fabric Usage Chart: This chart is an extension to our production tracking system. I love how colorful it is, I like to think that It makes looking at the information a little more fun. What we are showing in this chart is how much of each fabric it takes to make 1 of a certain style. They are ordered by fabrication (i.e. organic jersey, hemp-jersey, fleece) and totals are shown at the bottom of each fabrication as well as a grand total grid at the bottom of the sheet. This helps the girls in development get an accurate picture of how much fabric they will have to order for a given season. Before orders are actually placed, they can just get a rough idea by style and after orders are input, they get an even more accurate number because for each production run, the system will automatically calculate how much of each style was ordered and multiply it by the yield. This tool also references our “Spec Archive” where the girls in development and the pattern maker go to upload spec’s for each style and, if the spec is approved, the style shows up in yellow.
This Buyers Area is a password protected area on the Stewart+Brown site for retailers to go to preview the incoming season early. The design was based on our e-store but formatted so that the buyer can see each fabrication on it’s own page. Currently, I have the buyers area linked into a number of back end tools that manage the production and development process. If someone in production decides we’re not going run a color in a style, they can update it in the back-end and it will automatically update in the Buyers Area as well. This has really helped us cut down on communication errors and it ensures that buyers are always getting the most up to date information.
Buyers Area Style Selection: I built this tool that guides users through the process of adding a new season to the buyer area. Each link on the left is a step in the order it should be performed and the first step is selecting the styles that you want to be shown.
Edit Fabrications and Sidebar Ordering: In the buyers area, styles are organized by fabrication. This interface allows you to edit the images shown at the header for each fabrication, the text used to describe the interface as well as the order of the fabrication on the sidebar.
Custom Color Selection: Sometimes we use two different color swatches for the same color depending on the fabrication. For instance, sometimes our knitted black looks slightly different than our normal black. This lets you view the color swatches that will be used for each fabrication and override them with another color swatch if needed.
Slide Show Admin: Each season and delivery has it’s own slide show in the buyers area and this interface allows one to add images to the slide show, check a box for which seasons it should be shown in, tell the system which styles are shown in the image and order the images in your desired ordering.
Buyers Area Editing Sandbox: I realize the fact that using admin tools isn’t the ideal way for many people to add, edit and view information so I build this “sandbox” to use for editing. It is an exact replica of the buyers area except that each editable field has a link to the place that information can be edited.
Admin Documentation: I set another wordpress blog to serve as a help area for anyone using the system. Every tool I built has it’s own “how to” page and since it was built in WordPress, it came with the search functionality, the categorization and comment capabilities. The comments have been used as a way to add to or comment on the help instructions.