Jump to content
onjegolders

New Milktop website and brand

Recommended Posts

Hey all, just wanted to share with you the new Milktop website http://www.milktop.co.uk/ (powered by PW of course).

post-502-0-90103100-1387657000_thumb.png

This comes to life as the result of merging Milktop with ED DESIGN ( the design company of Diogo, who you all know and love and his partner Erika, a fantastic graphic designer). It's been great to work with this new team, and we hope that you guys will like the website as much as we have enjoyed creating it :)

A few notes on how we accomplished some things:

For the grid we used Bourbon Neat. We wanted to try out this framework since it doesn't make impact at all on the markup. We're pretty happy with the result, but in the end we feel like we didn't save that much time by using it than if we would have used simple SASS variables or created our own mixins.

For the icons we used Fontello. This is great because it allows you to create a new font with your own set of icons from several sources, and even add some custom built icons by importing a SVG drawing. One advantage is that the final font only has the icons that you put there, which makes it a very small download.

We decided to use large images to display our work in the best way possible, but we're serving smaller images for smaller screens. We do this by serving the smaller size by default and swapping the image for a larger version by measuring the container element :

<img data-large="<?php echo $img->url; ?>" src="<?php echo $img->width(400)->url; ?>">
 

For speed we are using the excellent ProCache module by Ryan :)

For publishing automatically to Twitter and Facebook we plan to (not done yet) publish a RSS feed with Ryan's RSS module and use IFFFT to pull it into both social networks. If you don't know IFFFT, you should definitely check it out.

A final detail, our logo is designed in HTML and CSS ;)

Hope you guys like it and thanks again to the great ProcessWire community without whom this collaboration would never have happened.

Have a great evening.

  • Like 19

Share this post


Link to post
Share on other sites

You guys hooked up? Like a ProcessWire marriage? I must have missed that one. Good luck on the new business!

Great work on the website. Looks really, really good.

  • Like 6

Share this post


Link to post
Share on other sites

Good business look with a background both contributing to the business look and easy for the eye.
We'll that is a surprise two smart webforces here joined, congrats on both your futures.

  • Like 1

Share this post


Link to post
Share on other sites

Thanks for all the reactions guys :)

You guys hooked up? Like a ProcessWire marriage?

I guess you can call it that :D

We have a very interesting triangle Solihul/Frankfurt/Porto going on here, and hope we will show more nice websites on the forum soon ;)

@pwired, you completely missed the point here and I hope others didn't interpreted it the same way. The CSS logo is not about performance at all, it's just a "nice to have" feature, something to represent what we do. We know most people won't even notice, but we think it's a nice touch for those who do.

I can design a good logo with photoshop in 10 minutes

*sigh*

Well, then again, thanks to all :)

  • Like 2

Share this post


Link to post
Share on other sites

@pwired, you completely missed the point here

We'll if the point wasn't about performance but about nice to have feature then better be more clear about it

instead of leaving it open for other interpretations such as html/css or graphic performance.

Re-edited my post.

Share this post


Link to post
Share on other sites

Looks just as good on desktop as on mobile, which I commented on earlier.  ^-^

And good luck to all on this new venture - here's to a successful new year!

  • Like 3

Share this post


Link to post
Share on other sites

Thanks guys for all your feedback guys :) Yeah I guess this is almost like a PW marriage! Maybe a new sub-forum Ryan?

On a serious note, I'm really pleased to be working with Diogo and Erika, we just have some work to do to get across to clients who we are and how we work.

  • Like 1

Share this post


Link to post
Share on other sites

Very nice!

The images on the about page do not show on desktop version (running firefox 25 windows) but when I resized the window they show up :)

  • Like 2

Share this post


Link to post
Share on other sites

The images on the about page do not show on desktop version (running firefox 25 windows) but when I resized the window they show up

I can reproduce what Peter Foeng has found with Firefox on windows desktop:

images on the about page only show up after resizing the window.

With Cometbird browser, even after resizing the window, images do not show up.

With Opera browser the images show up ok.

  • Like 2

Share this post


Link to post
Share on other sites

It's fixed :)

for info: we had a grayscale filter on the css for those images that was causing the weird behaviour. For now we only removed it because we don't need it anymore, but later I will investigate why.

Thanks guys!

  • Like 2

Share this post


Link to post
Share on other sites

I keep misreading the subject of the thread as "New Milktops webiste and BAND"

Which sort of puts a whole new spin on the project.

When you auditioning for musicians?

  • Like 1

Share this post


Link to post
Share on other sites

Love it all. Love the favicon and jealous of it's clarity—congrats!

  • Like 2

Share this post


Link to post
Share on other sites

Was browsing through different PW sites and came across yr post. Congrats on the new site - it looks great!

  • Like 1

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    No registered users viewing this page.

  • Similar Content

    • By angelo, italy
      Hi guys,
      I've always used WP but I want to swtich to PW. I'm not sure ....
      I'd like to know if it's possible to create a website for an online photo contest.
      The participants of the competition could create their own account, in which they upload their photos. The photos uploaded remain visible only to themselves and the judges.
      From their account they can make the "entrance fee" payment.
      The judges of the competition can create their own account... entering they see the photos of the participants and vote photos
      At the main page I imagine the title of the competition, a button to read the regulation, and a button to register.
      The website should be in Italian and English.
      Thank you!!
       
       
    • By AndZyk
      S. Siedle & Söhne Telefon- und Telegrafenwerke OHG is one of the leading manufacturers of building communications technology in Germany and Europe. For a company of this size it is important to have a solid brand communication. For this reason our agency designconcepts developed a portal where the employees of the company as well as others who work with or have interest in their brand can find everything that is important for the brand Siedle.
      The website introduces the brand, provides informations for different topics (for example logos, typography, colors etc.) and has a large Media-Center with images, videos and documents. The website was build with the framework UIkit.
      brand.siedle.com
       
      Features:
      Repeater Matrix Protected Content Media-Center Cart Auotcomplete Search  
      Repeater Matrix
      The information pages are build with a Repeater Matrix field and have a two columns layout. To be even more flexible, a section is a content element containing two Repeater Matrix fields for each column. This maybe sound crazy at first but was no problem and made complex layouts possible. 😀

       
      Protected Content
      Not all of the informations are meant for guests, so we made it possible to protect each page, section and content element with a checkbox. If this checkbox is checked, the content will only be visible for logged-in users.
       
      Media-Center
      The core of the brand portal is the Media-Center. The Media-Center is actually a mirror of a separate digital assets management database where the client can manage images, videos and documents with a nice interface in a protected environment.
      All new assets will be synced via a shell script containing PHP and curl commands calling the API of the database. This script will be executed every 15 minutes via cron job. This way all of the assets are saved as pages in ProcessWire and we can expand them with our own logic and fields. Also for the unlikely case that the database is not available, the Media-Center would still work.
       
      Cart
      Inside the Media-Center you can add assets to your cart. This cart is for downloading selected assets or sharing them with others. A cart will be accessible for 30 days.
       
      Modules used:
      Admin Custom Files Continents and Countries Email Obfuscation (EMO) Front-End Page Editor Functional Fields Markup Sitemap XML ProCache Repeater Matrix Tracy Debugger Upgrades  
      Regards, Andreas
    • By henri
      Hi Guys, 
      I am new to processwire. I have to move a proceswire web to another server. How do i do that??? copying all the files doesnt seem to do the trick. I am presented with a very very old version of the website. What do I do wrong??
    • By Sabrina
      Hi,  
      I would like to start tracking my website visitors with Leady software. Searched the forum for similar discussion yet did not find the right answer. Could you please tell me how can I add their javascript to my website? Is there any step by step guide available?
      Any help appreciated. 
    • By JeevanisM
      Hello All,
      I started with Joomla on this CMS parade. Then later I put my hands on Wordpress and eventually settled into Concrete 5.  Recently I came to know about ProcessWire CMS, while I was looking for a better replacement for Concrete 5 in terms of robust, easiness, compact.  I went through few Video tutorials of PW and read the documentation. The installation of PW was smoothy.
      The concept of Page is awsome. I like the relation of Page, Fields & Templates. There are many things I can equal to Concrete 5 from ProcessWire, yet PW offers a tiny minimal, code level approach for CMS. We have full control over design & data. There are some pitfalls I felt such no sitewide settings, global logo setup etc but it is easily tackled with some API codes. PW api seems amazing, it is par with what Concrete 5 Offers.
       
      I have done a simple website in ProcessWire now and going to do a lot further :
      http://insignnia.in/
×
×
  • Create New...