Web Design and SEO Blog

Oct201324

New Website Development for Northwest Regional Telehealth Resource Center

by JTech Communications in Announcements, Design, Development

NRTRC Logo
NRTRC Logo
JTech Communications won a request for proposal (RFP) submitted by the Northwest Regional Telehealth Resource Center (NRTRC), with a web development plan for a fully modern website designed to their specification. NRTRC is is a coalition of telehealth organizations in the northwestern United States – including Montana, Alaska, Washington, Oregon, Idaho, Wyoming and Utah. They provide resources to assist in providing remote healthcare to businesses and organizations in all of these states from their office in Billings, Montana. NRTRC offers educational opportunities, webinars, conferences, coaching and more to assist organizations running call centers, offering online medical information, remote monitoring of vital signs, and other telehealth services.

JTech’s Montana web development team is planning a new website for NRTRC that is robust and modern, including responsive website design and a clean information architecture that makes finding important telehealth information easy. We're excited to be developing an advanced custom website with NRTRC that perfectly suits their needs — and to help facilitate the flow of vital telehealth information to telehealth service providers.
Oct201316

Smart Scheduling for American Paintball Park

by Joshua Reynolds in Announcements, Design, Development

Signing up for a day of paintballing.
Signing up for a day of paintballing.
American Paintball Park is a recreational paintball park in Livermore, California. In addition to paintball, American Paintball Park offers laser tag. Teamwork, leadership, fun and safety are on the menu every day.

Our Bozeman, Montana advanced website development team upgraded American Paintball Park's website with an online scheduling system that helps clients reserve space at their event facility. We designed and built them a custom website calendaring system that manages availability and reservations for paintball parties of differing lengths and sizes without double-booking or manual data entry for who booked what and when.

The new website system’s design takes potential paintballers through an easy web interaction — first, pick how long a party you want and how many friends you'll be bringing. Second, pick an available slot for parties of that length. Then, let American Paintball know who you are and how they can get ahold of you to keep your reservation. That's it! Web development that makes it as easy to schedule an event as splattering your friend with a few rounds of brightly-colored pigment.
Oct201315

Using Forms to Help Customer Interaction

by Joshua Reynolds in Design

Our contact form before any action is taken.
Our contact form before any action is taken.
The second stage of JTech's contact form.
The second stage of JTech's contact form.
A third and final stage of our contact form.
A third and final stage of our contact form.
One of the most flexible and frequently-overlooked parts of your website are the forms that power customer interaction. Forms are incredibly flexible and can do almost anything— from simple contact forms with names, emails and phone numbers to complex, multi-stage scenarios where credit cards are processed or job applications with resumés are accepted. A logic-driven form can power support trees that intelligently route customers to the correct department and send internal emails to the relevant customer service personnel.

On the newly updated JTech website, we've built a single form that handles all of our frequent contact scenarios. For people who are saying hello or giving simple feedback, the form has one page and the message can be quickly sent — no hassle.

For customers wanting to file a service request, or for potential customers asking us about a new project, our form dynamically increases in complexity, by requesting information about their company and their project in additional stages. If they're looking for a new project, the form sends their inquiry to a different department than forms requesting maintenance or updates to an existing project.

These examples are just the beginning. Using forms, your website can become as interactive as you need to serve all of your target audiences.

Featured Client

YMCA
YMCA
Gallatin Valley YMCA Website
Gallatin Valley YMCA Website
Enhancements to YMCA
We have a long-standing relationship with the Gallatin Valley YMCA. They're doing great work in our community, and we're proud to sponsor them. Most recently, we've overhauled the registration system we built for their programs, events and athletics to streamline kids being added to the appropriate sports teams.

We've continued to improve their site since it first launched in 2011, and have always been pleased with the clean, cheerful, robust website. The Gallatin Valley YMCA is a pillar of our community — if you're interested in volunteering, sponsoring or are interested in enrolling your kids in their program, visit their website!

www.gallatinvalleyymca.org
Oct20137

2013 Autumn Marketing Intern: Josh Hamilton

by Joshua Reynolds in Announcements

Josh Hamilton
Josh Hamilton
JTech is pleased to welcome our 2013 Autumn Marketing Intern, Montana native Josh Hamilton. Josh is a Senior at MSU Bozeman completing his major in Business Management and minor in Economics and Management of Information Systems. He'll be working with JTech through the fall semester.

Josh Hamilton collaborates with Mike Kostrey, our Search Marketing manager, focusing his energy on outreach and optimization. When he's not devising strategies to help JTech's clients succeed online, Josh travels the nation playing ultimate frisbee with the MSU and Bozeman club teams. Welcome, Josh!
Sep201330

JTech's Joshua Reynolds Accepted into Leadership Montana

by JTech Communications in Announcements, Industry News

Yellowstone. Photo credit: <a href="http://www.flickr.com/people/kenlund/">Ken Lund</a>.
Yellowstone. Photo credit: Ken Lund.
Earlier this year, JTech's president and owner Joshua Reynolds was accepted into Leadership Montana's 9-month program of personal and trustee leadership development. He and 48 classmates will take a comprehensive leadership curriculum and willtravel around the state learning more about what makes Montana and its communities tick.

The course recently began in Big Sky, Montana, where they learned from various state and local leaders — including Pam Bucy, Commissioner of Montana’s Department of Labor and Industry and Dan Wenk, Superintendent of Yellowstone National Park.

Future excursions will take Joshua and the rest of the Leadership class across Montana — to Great Falls, Bozeman, Helena, Miles City, Kalispell, and Billings. Learn more about Leadership Montana and all it has to offer on their website: leadershipmontana.org.
Sep201324

A New Look for Swanson Construction's Projects

by Joshua Reynolds in Announcements, Development

A custom entryway designed by Swanson Construction.
A custom entryway designed by Swanson Construction.
Bozeman's Swanson Construction builds breathtaking custom homes all over the west. JTech shares Swanson's firm belief in their guiding principle, "There Is No Substitute for Quality" — and with that in mind, we rebuilt the Projects gallery of their website to cleanly showcase their workmanship and excellent attention to detail.

We replaced a Flash gallery of their work with a modern, HTML5 and javascript-based approach that allows viewers to quickly transition between projects and thumbnails of photos within each project. The new gallery fits in perfectly with the rest of their website and does a great job demonstrating the quality of Swanson's work.

Have a look at the gallery we built of Swanson Construction's Custom Homes and Architectural Projects.
Sep201317

Designing Responsively

by Felix Wolfstrom in

An introduction: shiny things, negative space and usability.


As JTech’s designer, I’m the visual voice behind the curtain of almost all our recent websites. My formal training is in visual graphic design, but my youth was squandered tinkering in ResEdit, hand-coding HTML, and deconstructing user interfaces. I’ll be making regular contributions about the graphical aspects of modern web development for the JTech Technical Blog.


Early in 2011, JTech hired me on as a human interface designer. Great job title — and a promising description of the kind of work I hoped to be doing. The workflow in those early days working with JTech will sound familiar to seasoned designers; I arranged every pixel into Photoshop comps to share with our clients. With the client's approval, our development team chopped and optimized my comps into HTML, CSS and javascript.


Fast-forward to the present.


Two years and many workflow iterations later, we're reorganizing almost everything to accommodate an internet that's changing dramatically as we watch. The size and shape of devices used to reach the internet has become wildly variable; in fact, the only thing we can (generally) count on is that our work will be presented in a frame that resembles a rectangle.


Here's a guiding statistic: 45% of all 18-29 year olds who use the internet on their phones do most of their online browsing on their mobile device. That's enough to make you stop and think — will the website you designed for a conventional monitor turn people away when they try to use it on their phone?


Responsive web design.



There are a few solutions to the problem of providing an optimized experience on multiple screen sizes, but we’ve chosen responsive web design, an approach that delivers a single build that responds dynamically to the size of the screen being used. Responsive sites rearrange their layout and resize their text and images to provide a readable, beautiful experience at any resolution and on any device. The latest draft of our own website is the first site we've created that adopts responsive design principles, albeit with more “break points” than we’ll usually produce on client work.


Responsive problem-solving.



As a designer, I'm scrambling to adapt to the challenges posed by responsive web design. Most of my challenges involve thinking in different viewports — rearranging, scaling, and showing or hiding elements of the website. Photoshop‘s role in the design process has been reduced— it defines the visual polish of the site, but plays a subordinate role to wireframes and behavior prototypes, where most of the work is done.


The puzzle of rearranging a website is sometimes called content choreography. This process gives the content a larger role in defining the design, because one of the earliest steps in developing a site's layout is determining the hierarchical importance of content — and which pieces of content need to remain associated with each other when the site is rearranged.



Scaling is a large part of content choreography. Should I scale the whole box, or just the content within it? Considering scaling has initiated changes in the way I create assets for the web. Because typography is universally-supported and fully-scalable, we've begun to build custom symbol-fonts for our new web projects (we started by using Fontello as a springboard). I collaborated with Patrick, our VP Technology, to build a symbol-font for the JTech site that we employ for our arrow buttons and close Xs. It not only scales well — it’s also lightweight and is easily animated using CSS. We've experimented with SVG and CSS shapes, but we’re limited by browser support and performance from using them extensively. On the latest iteration of the site we use CSS gradients in some places while employing raster images elsewhere to keep things snappy.


When our sites are viewed at extremes on either end of the spectrum — within very large and very small viewports — we need to do more than rearrange and resize the elements of each page's design. Perhaps the most common example of hiding complexity is primary navigation, which is often tucked away behind a menu button when the site is being viewed on a mobile phone or in a small window on your computer. Look at our website to see this in action — and see if you can spot some of the other content we hide for the mobile breakpoint of our site.


Redefining the workflow.


Our workflow continues to evolve as we change our web development goals. Layout is defined by wireframes — three different sets, at breakpoints for desktops, tablets, and mobile phones. Our wireframes are heavily annotated, with descriptions of how the site's design will morph as it deviates from our pre-defined resolutions. An example of this behavior: as the window gets bigger, column width may increase, the space between columns will grow, and the imagery will always scale so that it exactly fits properly. I want our websites to flex and grow naturally and look nice — even for scenarios that I haven't considered explicitly.



We use OmniGraffle (by the OmniGroup) to create our wireframes. It makes diagramming and layout simple — and most importantly, makes it easy to change things on the fly. For static layout, I find that OmniGraffle represents everything that Photoshop lacks. We augment these wireframes with behavior prototypes for interaction and animations, experimenting with tools like Adobe Edge and After Effects. This aspect of our workflow is very new and my own confidence in animation design is gradually growing as we integrate interaction into our designs.


Our workflow extends beyond our office — and beyond the goal of building a website that looks great regardless of the device. We also need our clients to understand what it means for their website to be responsive. When our clients are on board and understand that their website’s layout isn’t static, they will be better partners in defining the content and its hierarchy with us — in turn making their website an effective piece of communication. As I become more experienced designing responsive websites, I will in turn improve at articulating the responsive experience to our clients and how they should think about their website.


OK, so we're still figuring it all out.


The wild pace of change is what makes being a human interface designer exciting. Unsolved puzzles, new frontiers, and new details abound. I know I’ve just scratched the surface, and I’m eager to see what’s around the next bend.


I'm enthusiastic about all the changes coming down the pipe, and I'd love to hear from people who’ve experienced making the shift to responsive web design. If you can help us avoid your mistakes, even better! Drop us a line — we’d love to hear about your responsive design experience.

Sep201317

JTech Offers Responsive Web Design

by Joshua Reynolds in Announcements, Design, Development, Optimization

Responsive design on an iPhone.
Responsive design on an iPhone.
JTech's latest foray into cutting edge web design is responsive website design. Responsive design is a new paradigm where a single, flexible website is built to accommodate all devices — from tiny phones, to tablets, to huge desktop monitors. Rather than creating separate websites that are optimized for screens of a certain size, responsive design accommodates all sizes by creating a design that dynamically flows and resizes its contents for a legible and beautiful experience at any resolution.

The latest update to the JTech website is our first major case study for responsive design. For a detailed view of the new site, read more in the September JTech Dispatch. We've developed a new framework that provides extremely granular control over each element of the website and allows us to respond to the unique scenario in which the page is being viewed. This same granular control gives us hooks to create fluid, immersive animations and increased interaction throughout our new websites.

Talk to us today about building a website that accommodates users on any device.
Sep201317

Responsive Design

by Joshua Reynolds in Announcements, Design, Development

A brave new world.


We’ve just put the finishing touches on a new iteration of the JTech Communications website. This complete overhaul adds several new features and uses responsive design: depending on the screen size of the device being used to view it, the layout will shift and flow so that it’s legible, beautiful and well-optimized — no panning or zooming required. If you’re using a computer to read this, try navigating to our website and resizing your browser window to see the responsive layout in action.

Say less, show more.

Our new homepage offers a unique fly-through view of our portfolio — a distinctive flourish that we haven’t seen anywhere else on the web. Our team created clean, warm illustrations that begin to define a language characterizing our services and approach. We’ve added small touches throughout the site to increase its degree of interactivity: when transitioning between pages, cards slide in one at a time; when closing the detailed view of an article or biography, a subtle spinning animation gives feedback that your cursor is in the right place. Interaction also means creating a dialogue with our customers and peers — an effort we started through the JTech Dispatch and Weekly Announcements.



Creating a conversation about modern web design.

The site adds a technical blog, where we’ll share challenges, solutions, and perspectives about modern web development. We expect to post every month or so, sharing all our team members’ perspectives about what makes the work interesting, the challenges we face, and the ever changing industry in which we work.

We’ve also integrated social media hooks into the periodic aspects of our website. In recent months, we’ve opened Facebook, LinkedIn and Google+ pages where we share our latest announcements and connect with customers and peers. We’re charting a new path into the social side of the web, and we hope to cross paths with you there.



To the future!

Our new website is an exciting leap into the future of web design. From the responsive web design to the fluid animations and immersive, visual approach, we see this as a beneficial path for anyone doing business on the web. If you have questions about responsive web design or modern web development for your website, contact us today – we’d love to hear from you.
Sep201310

Big Changes to JTech’s Website

by Joshua Reynolds in Announcements, Design, Development

The new JTech website on an iPad.
The new JTech website on an iPad.
We’re excited to announce a major revision of JTech’s website! Major additions include a technical blog, illustrations, and a fun new home page. We rebuilt the entire site using responsive design, a technique that allows our site to be optimized for desktop, mobile, and everything in between.

Watch for the September issue of our JTech Dispatch for more details about the changes and additions. Check out the site at jtechcommunications.com!