Welcome to TalkGraphics.com
Results 1 to 6 of 6
  1. #1
    Join Date
    Dec 2006
    Location
    Melfort, Saskatchewan Canada
    Posts
    994

    Default Xara pro demo, animation and reveals

    For those that are relatively new to Xara, and animations, parallax and reveals I always consult this great demo page from Xara.
    http://previews.xara.hosting/charity/

    I’m amazed what Xara can do with the proper reveals and animations working together. I use the features sparingly, but on the demo page all the animations and reveals are explained well. I use this site as a reference for what Xara can do.

    Hope you find it informative.
    -Bill
    Bill Wood
    Charity Web Design
    XARA Pro+. WD17, Designer 17. Premium packages.

  2. #2
    Join Date
    Aug 2000
    Location
    Placitas, New Mexico, USA
    Posts
    41,486

    Default Re: Xara pro demo, animation and reveals

    Thanks for this Bill.

  3. #3

    Default Re: Xara pro demo, animation and reveals

    That's useful and informative Bill. Thanks.

    Seeing the effects on a real life page is worth bookmarking as a reference and nicely explained on the page. Using sparingly is the key thing as you say but used subtly adds a professional look.

    Best wishes,
    Ian

  4. #4
    Join Date
    Mar 2009
    Posts
    4,501

    Default Re: Xara pro demo, animation and reveals

    Thanks, Bill.

    @Xara: that link should be included in the manual for easy reference.

  5. #5
    Join Date
    Apr 2012
    Location
    SW England
    Posts
    17,744

    Lightbulb Re: Xara pro demo, animation and reveals

    Xara has a similar design - Single Page Websites > Wateraid.

    For this on-line presentation:

    • The Navbar needs to stick at top.
    • The Reveals should be set for one-time - they are tedious to endure repeatedly.
    • The pink 'donate now' ought to be sticky at top too
      • Xara actually needs a sticky at a defined position.

    • The coloured tags that have the same name as the headings in the NavBar should be on the same vertical line as the NavBar; it is just messy.
      • The fonts are different.
      • There could be a slightly different background colour and sticky at place to cover the same NavBar entry; this would give a rolling NavBar and a breadcrumb for little effort.

    • In poverty, you can never re-read the text under the swivel image without scrolling away and back again.
      • Having four effects on one picture is a mess.

    • In adoption, the nodding dogs is just that, noddy.
    • In gallery, the images pop-ups only cycle from the selected image to the last one.
    • The scroll to top symbol has to be found at the bottom; it needs to be sticky and in tune with the other graphics.


    Xara has used:
    • Seven fonts.
    • 182 images.
      • All are PNGs.
      • None have any meaningful filename.
      • I appreciate this is for Web Designer but the use of WebP and SVG would reduce the payload down from a whopping 2.6MB.

    • Highslide JS is Version: 4.1.13 (2011-10-06), Highslide CSS is v4.1.8.
    • Worse, jQuery is v1.11.1 | (c) 2005, 2014.
    • Animate.css is 2015.
    • Nothing for Accessibility.
      • Few [alt]s.
      • Few [title]s.

    • A non-secure website.


    The one good thing I like is the growing yellow logo that is transparent and become more opaque on scroll.
    Why is it a PNG? And why give it a solid kernel?
    For those who are interested, it is a Scroll Animation > Zoom/fade in up with a Slow reveal.

    I engage in remedial Xara design work for clients who appreciate they do not understand the product enough to achieve what they can imagine.

    Xara ought to showcase far better than this.
    More essential, Xara needs to demonstrate how any effects in its design templates have been realised.
    If it did this, I would lose out on paying clients but we all would gain in better websites that might encourage others to buy into the Xara brand.

    Acorn
    Acorn - installed Xara software: Cloud+/Pro+ and most others back through time (to CC's Artworks). Contact for technical remediation/consultancy for your web designs.
    When we provide assistance, your responses are valuable as they benefit the community. TG Nuggets you might like. Report faults: Xara Cloud+/Pro+/Magix Legacy; Xara KB & Chat

  6. #6
    Join Date
    Dec 2006
    Location
    Melfort, Saskatchewan Canada
    Posts
    994

    Default Re: Xara pro demo, animation and reveals

    Thanks @acorn. I did wonder how they produced the large yellow logo effect.
    Certainly I’d replace the text of “donate” in the white sticky bar at the top with the donate button.that would keep it at the top. Nav bar as mentioned should be a sticky.
    Caveat remaining that you can an effects or animations to the full width photo.
    Sometimes I fear adding to many effects on one element for fear of breakage. For example adding an animation on top, of a reveal animation.

    I don’t use effects much. But common ones I see are parallax, and fade in on particular elements. I use the fade in a lot for a softer feel.
    Bill Wood
    Charity Web Design
    XARA Pro+. WD17, Designer 17. Premium packages.

 

 

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •